К основному содержанию
скилл CX Codex

favicon — скилл для Claude Code: генерация и установка

Создаёт набор фавиконов из исходного изображения, обновляет манифест и HTML проекта. Пригодится при настройке и замене иконок сайта.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add brianlovin/agent-config --skill favicon -a claude-code
Открыть на GitHub

Что делает favicon

Скилл проверяет исходное изображение в формате PNG, JPG, JPEG, SVG, WEBP или GIF, затем создаёт favicon.ico, PNG-иконки и site.webmanifest. Для SVG он также копирует исходник как favicon.svg.

Он ищет тип проекта по конфигурационным файлам и выбирает каталог статики: среди поддерживаемых вариантов есть Rails, Next.js, Gatsby, SvelteKit, Astro, Vite, Angular и статический HTML. Если уже найдены файлы вроде favicon.ico, их папка получает приоритет. При неоднозначной структуре скилл запрашивает каталог у пользователя.

Для генерации нужен ImageMagick v7+ с командой magick; без него работа остановится до установки зависимости. Скилл берёт имя приложения из site.webmanifest, package.json, Rails-конфигурации или имени текущей папки, сохраняет существующие параметры оформления манифеста и обновляет ссылки в HTML или файле макета.

Какие задачи решает

  • создать favicon.ico с несколькими разрешениями
  • собрать PNG-иконки для браузера и мобильного экрана
  • обновить site.webmanifest именем приложения и списком иконок
  • добавить в HTML ссылки на новые фавиконы
  • выбрать каталог статики по структуре проекта

Примеры запросов агенту

  • Сгенерируй фавиконы из <path to source image> и обнови HTML проекта.
  • Создай site.webmanifest и набор иконок по файлу <path to source image>.
  • Проверь каталог статики и замени текущие фавиконы изображением <path to source image>.

Как установить favicon

1Через Skills CLI (Vercel)

npx skills add brianlovin/agent-config --skill favicon -a claude-code

2Вручную: положить файлы

~/.claude/skills/favicon/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/favicon/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Из того же набора12

sentry Даёт агенту правила Sentry для отслеживания ошибок и трассировки производительности в Next.js. Нужен при добавлении такой инструментализации в приложение. CX Codex +1 2 800установок chrome-webstore-release-blueprint Пошагово проводит через настройку OAuth и автоматическую публикацию расширения в Chrome Web Store по изменению версии. CX Codex +1 2 800установок tdd Внедряет строгий цикл разработки через тестирование red-green-refactor. Помогает писать проверки по публичным API и двигаться короткими шагами. CX Codex +1 2 800установок react-doctor Скилл прогоняет React-кодовую базу по 47+ правилам и выдаёт оценку от 0 до 100 с указанием файлов и строк. Пригодится перед ревью или когда проект тормозит. CX Codex +1 2 800установок reclaude Разбирает раздутый CLAUDE.md на короткий корневой файл и папку .claude/rules/. Пригодится, когда инструкции для агента разрослись и в них стало легко запутаться. CX Codex +1 2 800установок bun Переключает агента на среду Bun вместо привычных Node.js и npm. Настраивает команды запуска, встроенные базы данных и сервер без внешних пакетов. CX Codex +1 2 800установок workflow Заставляет агента планировать многошаговые задачи, делегировать разведку субагентам и доказывать, что работа сделана, прежде чем закрыть задачу. CX Codex +1 2 700установок fix-sentry-issues Скилл находит сбои через Sentry MCP, сортирует их и устраняет первопричину в кодовой базе. Помогает при разборе аварийных всплесков и очистке логов от шума. CX Codex +1 2 700установок

Похожие

favicon-gen jezweb Скилл создаёт набор иконок для сайта и PWA из логотипа, монограммы или фирменных цветов. Генерирует файлы SVG, ICO, PNG и манифест. CX Codex +1 2 200установок favicon-generator kostja94 Помогает собрать favicon и иконки приложений: размеры, форматы, теги в HTML и требования Google Search. CX Codex +1 1 100установок web-asset-generator alonw0 Генерирует фавиконки, PWA-иконки и мета-картинки Open Graph по логотипу, эмодзи или тексту. Пригодится при подготовке веб-приложения к публикации и оформлении сниппетов для соцсетей. CX Codex +1 933установок image-optimization aj-geddes Скилл подсказывает агенту, как сжать изображения и перевести их в современные форматы. Пригодится перед деплоем, когда страница тормозит на мобильных сетях. CX Codex +1 656установок image-manipulation-image-magick официальный github Обрабатывает изображения через ImageMagick: меняет размеры, конвертирует форматы и читает метаданные. Пригодится для миниатюр и пакетной обработки. 9 723установок app-icon Code-with-Beto Создаёт и настраивает иконки для проектов на React Native Expo под iOS 26 и Android. Задействует генерацию через SnapAI и прописывает ассеты в app.json. CX Codex +1 2 100установок

Рядом в теме «Фронтенд и UI»

Всё по теме «Фронтенд и UI» →

Вопросы о favicon

Как установить favicon в Claude Code?

Выполните npx skills add brianlovin/agent-config --skill favicon -a claude-code.

Что делает скилл favicon?

Он создаёт файлы фавиконов из одного изображения, формирует или обновляет site.webmanifest и правит теги иконок в HTML либо макете проекта.

Что нужно для работы favicon?

Нужен ImageMagick v7+ и доступная команда magick. Исходник должен быть PNG, JPG, JPEG, SVG, WEBP или GIF.

Смотрите также

Спонсоры проекта

Компании, которые помогают держать аналитику открытой