21 июня 2026 8 мин чтения 300

Как скачать логотип с любого сайта — 5 легальных способов

Нужен логотип банка для презентации, иконка сервиса для схемы интеграций, знак партнёра для слайда «нам доверяют». Рука тянется сделать скриншот, и в макет уезжает мыльный растр с куском чужого фона. Между тем логотип, который вы только что сфотографировали с экрана, лежит на том же сайте в векторе: сайт обязан был его откуда‑то загрузить, чтобы показать вам. Скриншот означает лишь то, что файл искали не там. Разберём, где он лежит на самом деле, — от самых быстрых источников к самым трудоёмким.

Коротко

Порядок от лучшего к худшему: каталог логотипов (SVG в один клик) → пресс‑кит бренда (официальные файлы с правилами) → DevTools (достанет логотип с любого сайта за 30 секунд) → правый клик → сохранить картинку → скриншот, если провалилось всё остальное. Про право использовать чужой знак — в конце: для большинства бытовых задач можно.

Способ 1. Правый клик — когда повезло

Правый клик по логотипу → «Сохранить изображение как…» или «Открыть изображение в новой вкладке». Если логотип вставлен обычным тегом <img>, вы получите исходный файл, и нередко это сразу SVG.

Везёт так примерно в половине случаев. Пункт «сохранить изображение» исчезает из меню, когда логотип вставлен инлайн‑кодом, нарисован фоном через CSS или прикрыт прозрачным элементом. Тогда файл всё равно существует — просто до него нужно добраться через панель разработчика.

Способ 2. DevTools — достаёт что угодно за 30 секунд

Панель работает одинаково в Chrome, Яндекс Браузере и Firefox:

Правый клик по логотипу → «Просмотреть код» (Inspect).
Панель откроется на элементе логотипа. Дальше три варианта:

<img src="..."> — откройте ссылку из src в новой вкладке и сохраните файл.
<svg>...</svg> — логотип вставлен инлайн. Правый клик по тегу → Copy → Copy element, и SVG‑код у вас в буфере. Вставьте его в файл с расширением .svg или прямо в Figma: она понимает SVG‑код из буфера по Ctrl+V.
background-image: url(...) в стилях — откройте URL из CSS и сохраните.

Проверьте добычу: настоящий вектор состоит из <path> и фигур, а один тег <image> внутри означает растр в векторной обёртке.

Отдельный случай — спрайт. Когда внутри <svg> стоит только <use href="#logo">, скопированный код в файле окажется пустым: сама фигура лежит в другом месте страницы, в блоке <symbol> или в подключённом файле спрайта. Найдите этот id поиском по документу (Ctrl+F в панели Elements) и копируйте фигуру оттуда либо откройте файл спрайта целиком по ссылке из href — заодно получите все иконки сайта разом.

Ищите логотип в футере и на странице «О компании»

В шапке сайта часто стоит упрощённая или анимированная версия знака. В футере, пресс‑разделе и на внутренних страницах нередко лежит полный вариант, а иногда и прямая ссылка на официальный архив со всеми файлами.

Способ 3. Пресс‑кит бренда — источник, который отвечает за файлы

DevTools достанет любой файл, но не скажет, актуален ли он. Пресс‑кит решает и это: у большинства средних и крупных компаний есть раздел «Пресс‑центр», «Медиа» или «Brand assets» с логотипами в SVG и PNG, фирменными цветами и правилами использования.

Отсюда два преимущества, которых нет у добычи из вёрстки: файлы гарантированно свежие, а правила применения написаны прямо рядом с ними. Ищите ссылку в футере сайта или по запросу «название бренда логотип пресс‑кит» либо «brand assets».

В хорошем пресс‑ките рядом с файлами лежат минимальные отступы вокруг знака, список запрещённых искажений и версии для тёмного фона. Эти правила экономят время на согласовании: если партнёр попросит переделать слайд, ссылка на его же гайдлайн закрывает вопрос за минуту.

Способ 4. Каталоги логотипов — когда знаков нужно много

Пресс‑кит хорош для одного бренда. Но когда собираешь сетку из десяти логотипов — список банков, схему сервисов, блок «нам доверяют», — обход десяти пресс‑разделов превращается в отдельную задачу, и файлы придут в разном качестве и разных пропорциях.

Каталог снимает обе проблемы разом: официальные версии собраны в одном месте и приведены к единому виду. Наш каталог логотипов сделан ровно под это: сотни российских и мировых брендов, у каждого — SVG, PNG нужного размера, копирование кода в один клик и перекраска прямо на странице.

Способ 5. Скриншот — крайняя мера

Остаётся случай, когда файла действительно нет: логотип запечён в растровую картинку вместе с фоном — например, в обложке видео или на фотографии вывески. Тогда скриншот с последующим кадрированием и удалением фона остаётся единственным вариантом, и качество будет равно размеру на экране.

Прежде чем смириться, проверьте способы 3 и 4: почти для любого заметного бренда нормальный файл где‑то лежит.

Что делать, когда Inspect ничего не нашёл

Отдельная категория сайтов прячет логотип так, что простой Inspect его не показывает. Здесь помогают три приёма поглубже:

Вкладка Network. DevTools → Network → фильтр Img, затем обновите страницу. В списке окажутся все картинки, которые сайт скачал, включая спрятанные в CSS и скриптах. Отсортируйте по имени: логотип обычно называется logo‑что‑нибудь, двойной клик открывает файл для сохранения.
Поиск по исходникам. DevTools → Ctrl+Shift+F → запрос «logo» или «.svg». Находит пути, зашитые в JS‑бандлы и JSON‑конфиги, куда Inspect не заглядывает.
Псевдоэлементы и иконочные шрифты. Если знак нарисован через ::before иконочным шрифтом, файла‑картинки не существует вовсе. Смотрите Computed → content и font‑family: скачивать придётся шрифт или искать альтернативу в пресс‑ките.

И общий совет: мобильная версия сайта иногда отдаёт другой, более простой файл логотипа — включите эмуляцию устройства в DevTools и проверьте.

Где ещё лежит вектор, кроме сайта

Сайт — не единственное место, куда файл уже попал в векторе.

PDF. Презентация, коммерческое предложение или годовой отчёт хранят логотип кривыми. Откройте PDF в Illustrator или Inkscape, выделите знак и скопируйте его обычной группой фигур. Растровым он окажется только тогда, когда в макет его вставили картинкой.

Презентации и документы. Файлы PPTX и DOCX устроены как zip‑архивы. Смените расширение на .zip, распакуйте и загляните в папку ppt/media или word/media: вставленные картинки лежат там в исходном виде, включая SVG.

Мобильное приложение. APK распаковывается тем же способом, а иконки внутри лежат в res/drawable — набором PNG под разные плотности экрана и векторным XML, который переводится в SVG конвертером.

Расширения браузера. Плагины вроде SVG Export и SVG Grabber собирают все векторы страницы в один список: это быстрее ручного обхода DevTools, когда со страницы нужно снять сразу десяток иконок. Проверять добычу всё равно придётся, потому что расширение вытащит и служебные значки интерфейса.

Четыре проверки скачанного файла

Добыча в руках, но перед вставкой в макет её стоит проверить по четырём пунктам:

Вектор или обёртка. Откройте SVG текстовым редактором: настоящий вектор состоит из <path> и фигур; один тег <image> выдаёт растр, замаскированный под SVG.
Актуальность. У брендов случаются редизайны, а в футерах, на старых лендингах и поддоменах годами живут прошлые версии знака. Сверьте файл с главной страницей бренда или его свежими соцсетями.
Полнота. В шапке часто стоит урезанный вариант — только знак без текста. Для презентации обычно нужен полный логотип, и его ищут в пресс‑ките.
Поля и холст. Вытащенный из вёрстки SVG нередко несёт viewBox с запасом: знак сидит в углу большого прозрачного прямоугольника и в макете выравнивается криво. Откройте файл в Figma — если рамка выделения заметно больше самой фигуры, обрежьте холст по содержимому.

Какой путь выбрать под задачу

Задача	Оптимальный путь
Один известный бренд для слайда	каталог: SVG за 10 секунд
Сетка «нам доверяют» из 10 логотипов	каталог: единое качество и стиль
Логотип малоизвестной локальной компании	DevTools по их сайту
Логотип для печати в высоком качестве	пресс‑кит (там вектор и правила)
Логотип из PDF‑презентации	открыть PDF в Illustrator/Inkscape и извлечь вектор
Старый логотип, которого нет на сайте	веб‑архив (web.archive.org) + DevTools

Последняя строка выручает чаще, чем кажется: Wayback Machine хранит старые версии сайтов вместе с файлами логотипов, и это единственный способ достать исторический вариант знака после ребрендинга. Проверяйте в архиве и внутренние страницы: снимки пресс‑разделов сохраняются вместе с файлами, и старая версия логотипа чаще находится именно там.

А это вообще законно

Само скачивание закон не нарушает — вопросы возникают к способу использования. Общий принцип такой: показывать логотип, чтобы указать на сам бренд (в статье, презентации, списке интеграций, способах оплаты), можно; выдавать за свой, намекать на несуществующее партнёрство или печатать на продаваемом товаре нельзя. Подробный разбор с судебной практикой и таблицей ситуаций — в статье можно ли использовать чужой логотип.

Не искажайте знак

Куда бы вы ни поставили чужой логотип, оставьте его пропорции, цвета и границы нетронутыми: растянутый или перекрашенный знак нарушает гайдлайн бренда и выглядит непрофессионально. Правила искажений разбирали в статье про брендбуки.

Если коротко

Скриншот стоит последним в списке, потому что вектор почти всегда уже существует: сайт загрузил его, чтобы показать вам, а бренд нередко выложил официальную копию отдельно. Поэтому и порядок действий обратный привычному — сначала каталог или пресс‑кит, затем DevTools, и лишь потом растровые компромиссы. Добытый файл проверьте на подлинность, актуальность и полноту, а в макет ставьте неискажённым.

Сэкономьте себе DevTools: в нашем каталоге логотипов знак любого крупного бренда скачивается в SVG и PNG за один клик — или копируется кодом сразу в Figma.