메뉴
Generate flat favicons from image prompts, then key out a magenta background and build PNG/ICO/WebP outputs with ImageMagick. Use when you need a reliable favicon workflow.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Create or update Pi skills (SKILL.md plus optional scripts, references, or assets). Use when someone asks to design a new Pi skill, refine an existing one, or structure skills for Pi discovery or packaging.
Guide for extending Pi — decide between skills, extensions, prompt templates, themes, context files, or custom models, then create and package them. Use when someone wants to extend Pi, add capabilities, create a skill, build an extension, or make a Pi package.
Long-running iterative development loops with pacing control and verifiable progress. Use when tasks require multiple iterations, many discrete steps, or periodic reflection with clear checkpoints; avoid for simple one-shot tasks or quick fixes.
Cheat sheet + workflow for launching interactive coding-agent CLIs (Claude Code, Gemini CLI, Codex CLI, Cursor CLI, and pi itself) via the interactive_shell overlay or headless dispatch. Use for TUI agents and long-running processes that need supervision, fire-and-forget delegation, or headless background execution. Regular bash commands should use the bash tool instead.
Clarify requirements before implementing. Do not use automatically, only when invoked explicitly.
Web search and content extraction via Brave Search API. Use for searching documentation, facts, or any web content. Lightweight, no browser required.
| name | favicon-generator |
| description | Generate flat favicons from image prompts, then key out a magenta background and build PNG/ICO/WebP outputs with ImageMagick. Use when you need a reliable favicon workflow. |
| compatibility | Requires ImageMagick (magick), uv, and GEMINI_API_KEY for image generation. |
Create clean, flat favicons with a transparent background. Generate a base PNG on a solid magenta background, remove the magenta with ImageMagick, then export favicon.ico, PNG sizes, Apple touch icon, and WebP.
uvmagick (ImageMagick)GEMINI_API_KEY setUse a solid magenta background so it can be keyed out later. Keep the icon flat and simple so it reads at 16×16.
Favicon icon, 1:1 square, solid magenta #FF00FF background. Simple flat vector icon of: <subject>. Bold geometric shapes, solid fills, no gradients, no shadows. Centered, fills 75–85% of frame. Do not use magenta in the icon.
Use the Nano Banana Pro skill to generate the PNG. Run from your project directory so outputs land where you need them.
Example (update the path for your agent):
~/.codex/skills/nano-banana-pro/scripts/generate_image.py~/.claude/skills/nano-banana-pro/scripts/generate_image.py~/.pi/agent/skills/nano-banana-pro/scripts/generate_image.pyuv run <nanoBananaDir>/scripts/generate_image.py \
--prompt "<your prompt>" \
--filename "yyyy-mm-dd-hh-mm-ss-favicon.png" \
--resolution 1K
Iterate at 1K, then re-run at 2K/4K only when the prompt is locked.
Run the script from this skill:
bash {baseDir}/scripts/faviconize.sh <input-png> <output-base>
Outputs:
<output-base>-transparent.png<output-base>-16.png, -32.png, -48.png<output-base>.ico<output-base>-apple-touch-icon.png (180×180)<output-base>-192.png, <output-base>-512.png<output-base>.webp (512×512)Set a different key color or fuzz if needed:
FAVICON_KEY_COLOR="#FF00FF" FAVICON_FUZZ="30%" bash {baseDir}/scripts/faviconize.sh input.png favicon
Add or update links in your HTML layout:
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png">
<link rel="apple-touch-icon" href="/favicon-apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
Update site.webmanifest:
{
"icons": [
{"src": "/favicon-192.png", "sizes": "192x192", "type": "image/png"},
{"src": "/favicon-512.png", "sizes": "512x512", "type": "image/png"},
{"src": "/favicon.webp", "sizes": "512x512", "type": "image/webp"}
]
}
#FF00FF background.