| name | nadicode-ai-designer |
| description | Generates visual assets (icons, illustrations, logos, hero images, background patterns, section dividers, Lottie animations, short video clips) by routing each request to the best AI provider and running a provider-tuned prompt. Use when the user asks for any graphic, image, icon, SVG, logo, hero, background, illustration, pattern, avatar, animation, or video asset. Routes between agent-svg (the calling agent authors SVG directly, with Recraft --format svg as the deterministic fallback for non-LLM agents), Recraft (vector and Lottie), FLUX (artistic raster), OpenAI Images (photorealistic), Ideogram (typography-heavy), Nano Banana (general raster), and Veo (video). Includes interactive credential setup via scripts/setup.js when providers are unconfigured. |
| license | MIT |
| compatibility | Requires Node.js >= 20 on PATH. Tested install paths for Claude Code, Codex, Cursor, GitHub Copilot CLI, Gemini CLI, Goose, OpenHands, Amp, Windsurf, JetBrains Junie, Continue, OpenCode, and Aider (read-only). |
| allowed-tools | Bash(node scripts/doctor.js:*), Bash(node scripts/setup.js:*), Bash(node scripts/list-jobs.js:*), Bash(node scripts/generate-flux.js:*), Bash(node scripts/generate-recraft.js:*), Bash(node scripts/generate-openai.js:*), Bash(node scripts/generate-ideogram.js:*), Bash(node scripts/generate-nanobanana.js:*), Bash(node scripts/generate-veo.js:*) |
nadicode-ai-designer
Generate visual assets via the right AI provider for each request.
Invocation
This skill follows the Agent Skills open standard. It is auto-invoked when the user asks for any graphic, image, icon, SVG, logo, hero, background, illustration, pattern, avatar, animation, or video asset. Agents that support slash commands also expose it as /nadicode-ai-designer. No explicit invocation is required: describing the asset in natural language is enough.
Representative user phrases that trigger this skill: "make me a search icon", "generate a hero background", "I need a logo for X", "draw a section divider", "create an avatar", "give me a Lottie loading animation", "render a short video clip of Y". In every case, the calling agent reads this file, picks a provider via the decision flow below, and either authors SVG directly (agent-svg path) or invokes one of the bundled scripts/generate-*.js binaries.
First-time setup
Before the first generation, check which providers are configured:
node scripts/doctor.js --json
If the provider for the user's request is unconfigured, offer interactive setup in chat:
- Tell the user which token they need and where to get it:
- Ask the user to paste the token directly into the chat.
- Run:
node scripts/setup.js --provider <name> --token <pasted-value> --json
The script validates the token against the provider's API and persists it
to .nadicode-ai-designer/config.json (mode 0600, gitignored).
- Re-run
doctor.js to confirm.
Do not ask the user to set env vars and restart the session. Drive setup inline.
The agent-svg path needs no token: if the calling agent can author SVG code, it does so directly. Agents that cannot author SVG route to Recraft's --format svg mode as the deterministic fallback (shared REPLICATE_API_TOKEN).
Decision flow
Read references/provider-routing.md for the
full decision tree. Summary:
| Want... | Provider | How |
|---|
| Icon, geometric pattern, section divider (SVG code) | agent-svg | Read references/agent-svg.md, then write the SVG directly to the target file. If your agent cannot author SVG, fall back to node scripts/generate-recraft.js --format svg — but note the fallback produces illustrated line-art SVG (larger, fixed colors), not the minified 24x24 currentColor icon the LLM-author path produces. See agent-svg.md "Quality tradeoff" for details. |
| Vector illustration, Lottie animation | Recraft | node scripts/generate-recraft.js |
| Artistic hero background, abstract raster | FLUX | node scripts/generate-flux.js |
| Photorealistic photo, avatar, product shot | OpenAI Images | node scripts/generate-openai.js |
| Logo, wordmark, typography-heavy graphic | Ideogram | node scripts/generate-ideogram.js |
| General-purpose raster image | Nano Banana | node scripts/generate-nanobanana.js |
| Short video clip (MP4) | Veo | node scripts/generate-veo.js |
When NOT to use this skill
- Editing existing images — this skill only generates. Use a different tool for crop, resize, filters, or inpainting.
- UI component code — this skill generates visual assets (files), not React/Vue components.
- 3D models, CAD, datasets, charts from data — out of scope.
- Photo restoration, face swap, deepfakes — out of scope.
Prompting per provider
Before calling any script, load the matching reference file for best-practice prompting:
Running a generator script
All generator scripts accept --json for machine-readable output:
node scripts/generate-flux.js \
--prompt "cinematic deep blue fintech hero, soft atmospheric glow, hex #0a0a0f base" \
--size 1920x1080 \
--output ./public/hero.png \
--json
On success, stdout contains exactly one JSON document:
{
"status": "completed",
"result": {
"jobId": "job-abc12345",
"provider": "flux",
"outputPath": "/abs/path/public/hero.png",
"metadata": { "format": "png", "duration": 4321, "prompt": "..." }
}
}
On failure: {"status":"failed","error":"..."} with exit code 1.
Human progress messages go to stderr. NO_COLOR env var disables colored output.
Other scripts
node scripts/doctor.js [--json] — report per-provider configured/unconfigured status. Run first if a generation fails with "not configured". JSON shape:
{
"status": "ok",
"providers": [
{ "name": "flux", "envVar": "REPLICATE_API_TOKEN", "configured": true, "source": "env" },
{ "name": "openai", "envVar": "OPENAI_API_KEY", "configured": false, "source": "unset" }
]
}
source is one of: agent-native | env | env-file | config-file | cli | unset.
node scripts/setup.js --provider <name> [--token <value>] [--persist env|config] [--force] [--json]
Validate and persist a credential. Without --token, prompts on stderr.
Validation calls the provider's cheapest authenticated endpoint; fails fast on 401/403.
--persist config (default) writes to .nadicode-ai-designer/config.json (mode 0600).
--persist env writes to ./.env. Both paths are gitignored.
node scripts/list-jobs.js [--status pending|running|completed|failed] [--json]
List tracked jobs from .asset-jobs.json in cwd.
node scripts/validate-skill.js [--json] [--path <dir>]
CI-time gate. Validates SKILL.md against Anthropic's quality rules (frontmatter
limits, body length, reference depth, no Windows paths, no time-sensitive strings).
Secrets
Scripts resolve each provider credential in this order:
CLI --token flag → --env-file <path> → process env → .nadicode-ai-designer/config.json → defaults
Env vars:
| Variable | Provider(s) |
|---|
REPLICATE_API_TOKEN | Recraft + FLUX |
OPENAI_API_KEY | OpenAI Images |
IDEOGRAM_API_KEY | Ideogram |
GOOGLE_API_KEY (fallback GEMINI_API_KEY) | Nano Banana + Veo |
setup.js scrubs --token from argv and process.title immediately after parsing so the token does not linger in /proc/<pid>/cmdline or shell history.
Never commit tokens. See references/provider-knowledge.md for per-provider details and pricing.
Concurrency
Scripts persist to .asset-jobs.json in the current working directory with single-writer semantics — do not run multiple generate-* scripts against the same cwd in parallel. The jobs file uses atomic file replacement for writes, but the read-modify-write sequence is not locked across processes.
