Добавьте иконки приложения с помощью ИИ: без ручных шагов
Старый способ: открыть генератор, загрузить изображение, скачать zip, распаковать, скопировать файлы в public/, вручную вставить двадцать тегов link. Новый способ: скажите своему агенту "добавь favicon", и он окажется в репозитории с уже пропатченным head, готовый к работе.
Как всё это происходит
- 1
Вы просите
Одна фраза в Claude Code, Cursor или любом агенте с поддержкой MCP. Ничего не нужно готовить.
- 2
Он генерирует
favicon.ico, все размеры PNG, apple-touch, иконки Android, адаптирующиеся к теме светлые/тёмные версии и manifest.json.
- 3
Он устанавливает
Файлы записываются в ваш статический каталог, нужные теги <head> добавляются в ваш layout, ничего не нужно переносить вручную.
Два способа подключить
Оба не требуют настройки, кроме единоразовой подготовки, и оба записывают файлы прямо в ваш проект.
Вариант A: skill appicons
Открытый исходный код, встроен в вашего агента
- Учит агента превращать намерение в набор иконок и устанавливать его.
- Вы просто общаетесь с ним, не выбирая ни форматов, ни размеров.
- Под капотом он преобразует ваши слова в источник, вызывает API favicontools.com и распаковывает результат в public/.
Вариант B: MCP-сервер Favicon Tools
Два инструмента, добавленных в арсенал вашего агента
- search_inputs для поиска вариантов, generate_iconset для создания набора.
- Возвращает URL-адреса CDN для каждого файла, а также готовый к вставке фрагмент head.
- По умолчанию возвращает полный набор по окружениям (чистую иконку для production плюс варианты staging/dev со значком), чтобы агент мог настроить иконки по окружениям в том же вызове.
Общение со skill
"Add a fox favicon to this app."
"Generate app icons for this site from our logo at public/logo.svg."
"Give this project a proper favicon using the React logo."
"Make me a favicon from https://example.com/mark.png."Четыре промпта, каждый из которых даёт полный, установленный набор иконок.
Добавление MCP-сервера
// .mcp.json
{
"mcpServers": {
"favicontools": {
"type": "http",
"url": "https://favicontools.com/api/mcp"
}
}
}Одна запись — и у агента есть оба инструмента. Настройка по окружениям по умолчанию означает, что иконки для разных окружений возвращаются в том же вызове.
Вы описываете простыми словами
Вы никогда не выбираете форматы или размеры иконок. Вы говорите, что хотите; агент сопоставляет это с источником.
| Что вы говорите | Что использует агент |
|---|---|
| Эмодзи или настроение | Имя из Iconify, например noto:fox или twemoji:rocket |
| Бренд / продукт | simple-icons:stripe, logos:github-icon |
| Ваш собственный логотип | Путь к файлу, например ./public/logo.svg |
| URL изображения | URL, растеризованный на сервере |
Как выглядит "готово"
| Что появляется | Детали |
|---|---|
| Файлы иконок | Все в public/ (или app/ для Next.js). |
| Теги head | Полный блок <head> или метаданные layout, ссылающиеся на них. |
| manifest.json | С реальным именем вашего приложения и start_url. |
| Старый favicon.ico | Удалён, чтобы кэш не отдавал заглушку. |