Где взять логотип AWS или Stripe в векторе и не сойти с ума

Вспомните, сколько раз вы искали актуальный логотип какого-нибудь сервиса для лендинга или схемы архитектуры. Обычно сценарий такой: идешь в Google Images, находишь мутный PNG, потом ищешь брендбук, скачиваешь огромный архив на 200 Мб ради одного файла или вытягиваешь кривой вектор из чужих Figma-проектов. Это дико раздражает, особенно когда нужно быстро набросать прототип.

Недавно наткнулся на репозиторий theSVG, который решает эту проблему раз и навсегда. Это не просто очередная подборка иконок, а огромная база из 5600+ официальных логотипов брендов и облачных сервисов, упакованная в удобный инструмент для разработчиков.

Что внутри этого хранилища

Создатели проекта решили собрать всё, что обычно разбросано по пресс-китам. Сейчас в базе больше четырех тысяч брендов и, что особенно круто, свежие сеты иконок для облачной архитектуры.

Вот что ребята успели упаковать к началу 2026 года:

• 4019 логотипов компаний (от платежек до соцсетей)
• 739 иконок сервисов AWS
• 626 иконок Azure
• 214 иконок Google Cloud

Самое ценное здесь — вариативность. Для большинства популярных брендов есть не только основной логотип, но и монохромная версия, варианты для темной и светлой темы, а также вардмарки (логотип вместе с текстовым названием).

Как это использовать в коде

Проект не заставляет вас скачивать файлы вручную (хотя и так можно). Есть несколько способов интеграции, которые закрывают почти все потребности фронтенд-разработки.

Самый простой путь для быстрой вставки — CDN. Не нужно ничего устанавливать, просто копируете ссылку. Конструкция простая: thesvg.org/icons/{название}/{вариант}.svg.

<img src="https://thesvg.org/icons/github/default.svg" width="32" height="32" alt="GitHub" />

Если вы пишете на React, Vue или Svelte, есть типизированные пакеты. Это удобнее всего: вы получаете автодополнение в IDE и нормальную работу с типами. Пакет thesvg весит прилично из-за базы, поэтому лучше использовать раздельные импорты или пакет @thesvg/icons — он дружит с tree-shaking, так что в бандл попадет только то, что вы реально использовали.

Пример для React выглядит максимально привычно:

import { Github, Figma } from "@thesvg/react";

export function Footer() {
  return (
    <div>
      <Github width={24} className="fill-current" />
      <Figma width={24} />
    </div>
  );
}

AI-ready и CLI-утилиты

Интересная деталь: авторы добавили MCP-сервер (Model Context Protocol). Это значит, что если вы используете Claude, Cursor или Windsurf, ваш ИИ-помощник может сам искать и вставлять нужные иконки в проект, имея прямой доступ к базе theSVG. Это экономит кучу времени на рутинном поиске.

Для любителей терминала есть CLI. Можно быстро найти нужную иконку или выкачать её локально одной командой:

npx @thesvg/cli search "openai"
npx @thesvg/cli add stripe

Пара слов о лицензиях

Тут важно понимать тонкий момент. Весь код и инструменты распространяются под лицензией MIT, но сами логотипы принадлежат брендам. Ребята из theSVG честно пишут об этом в дисклеймере. Использование логотипа Stripe в вашем приложении должно соответствовать их правилам использования торговых марок. Однако для визуализации архитектуры, дашбордов или разделов «Наши партнеры» это идеальное решение.

Кому точно пригодится

По моему опыту, проект закроет задачи в трех случаях:

1. Архитекторы и DevOps. Если нужно рисовать диаграммы облачной инфраструктуры (AWS/Azure) и хочется, чтобы они выглядели профессионально, а не как набор разношерстных картинок.
2. Фронтенд-разработчики. Когда в макете есть список поддерживаемых технологий или способов оплаты, и нужно быстро вытянуть десяток чистых SVG.
3. Создатели контента и технических блогов. Чтобы не искать каждый раз логотип языка программирования или фреймворка в хорошем качестве.

Попробовать проект можно прямо в браузере на сайте thesvg.org — там удобный поиск и превью всех вариантов иконок.

Если вам не хватало какой-то иконки, в репозитории очень лояльно относятся к PR. Можно просто закинуть недостающий логотип через форму на сайте или классическим Pull Request, и его добавят в общую базу. Один из тех случаев, когда Open Source реально упрощает жизнь.