Stats
Actions
Tags
From dev-team-kit-fv
Generates and adapts visual assets (hero images, icons, favicons, mascots, illustrations, backgrounds) while maintaining consistency with existing project visual identity. Handles text-to-image, image-to-image derivation, background removal, and favicon/icon conversion.
How this skill is triggered — by the user, by Claude, or both
Slash command
/dev-team-kit-fv:17-image-generator [tipo: t2i|i2i|rembg|ico] [prompt ou caminho-da-imagem][tipo: t2i|i2i|rembg|ico] [prompt ou caminho-da-imagem]This skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
O Image Generator cria ou adapta assets visuais mantendo consistencia com o contexto real do produto.
O Image Generator cria ou adapta assets visuais mantendo consistencia com o contexto real do produto.
Esta skill segue GLOBAL.md, policies/execution.md, policies/handoffs.md, policies/token-efficiency.md, policies/stack-flexibility.md, policies/tool-safety.md e policies/evals.md.
t2i) ou derivar asset existente (i2i)Se o repositorio ja tiver imagens, ilustracoes, icones, logos, backgrounds, mascotes ou design tokens, a skill DEVE analisar esse contexto primeiro.
Nunca gerar asset como se o projeto fosse uma folha em branco quando ja existir linguagem visual estabelecida.
Antes de gerar qualquer imagem, verificar nesta ordem:
UI/UX e design tokens do projetopublic/, assets/, src-tauri/icons/ ou caminhos equivalentest2i: usar apenas quando nao houver asset base adequadoi2i: preferir quando o projeto ja tiver mascote, icone, ilustracao ou base visual reutilizavelSem override explícito, a skill aplica esta regra:
| Cenário | Model default | Custo | Razão |
|---|---|---|---|
| text-to-image (sem imagem de referência) | grok-imagine | $0.020/img | Estética boa, custo baixo, default pra criativos |
edit-image (com referenceImages) | gemini-25-flash | $0.039/img | Melhor capacidade de refine/inpaint com base |
Override só se o caso exigir (ex: tipografia complexa → gemini-3-pro, OG card final → gpt-image-1.5). Decisão sempre registrada na evidência de conclusão.
Fonte única: models/image-models.json — atualize lá quando preços mudarem; propaga pra scripts/generate-image.mjs e templates/stack-default/fal/config.ts automaticamente.
| Tipo | Quando usar | Skill responsavel |
|---|---|---|
hero | imagem principal acima da dobra | 17 (esta skill) |
mascote | personagem da marca em nova situacao | 17 (esta skill) |
illustration | ilustracao explicativa de conceito | 17 (esta skill) |
background | textura ou fundo de secao | 17 (esta skill) |
layout | imagem compondo secao ou tela inteira | 17 (esta skill) |
icon | icone de funcionalidade ou servico | 17 (esta skill) |
favicon | favicon multi-tamanho + apple-touch-icon + PWA icons | 36 (Web Asset Generator) — dedicada |
social-card (OG / Twitter) | Open Graph, Twitter card, share image | 36 (Web Asset Generator) — dedicada |
pwa-icon | maskable icon, manifest, browserconfig | 36 (Web Asset Generator) — dedicada |
Divisao clara: skill 17 e para assets criativos (geracao do zero ou derivacao). Skill 36 e para assets web operacionais derivados de logo existente (favicon, OG, PWA — pipeline mecanico, nao criativo). Se logo ainda nao existe, skill 17 cria primeiro; depois skill 36 deriva os formatos.
i2i, descrever apenas a mudanca desejada e preservar o restoEsta skill e vendor-agnostic por design (policies/stack-flexibility.md). A tabela abaixo cobre fal.ai como implementacao recomendada — substitua por Replicate, Stability, OpenAI direto ou self-hosted se a stack do projeto ja usa outro provider.
Precos podem mudar sem aviso. Fonte canonica: fal.ai/pricing (verificar antes de batch grande). Esta tabela e snapshot —
docs/skill-guides/image-generator-models.mdtem detalhes mais granulares e link por modelo.
| Modelo | Preco | Quando usar | Endpoints |
|---|---|---|---|
| gpt-image-1-mini | $0.005-$0.052 (varia por qualidade/tamanho) | Volume alto, custo baixo. Variacoes rapidas, testes, scaffolding. | fal-ai/gpt-image-1-mini, .../edit |
| Gemini 2.5 Flash | $0.039/img (fixo) | Producao em escala com custo previsivel. Hero, ilustracao, background padrao. | fal-ai/gemini-25-flash-image, .../edit |
| Gemini 3 Pro (Nano Banana Pro) ⚠ preview | $0.15/img (4K = $0.30) | Prompt dificil, tipografia, composicao complexa. Quando o pedido cita texto na imagem ou layout especifico. Endpoint preview — pode mudar / preco pode subir sem aviso. | fal-ai/gemini-3-pro-image-preview, .../edit |
| gpt-image-1.5 | $0.009-$0.20 (varia) | Acabamento final. Alta fidelidade, aderencia forte ao prompt, preserva composicao/iluminacao. Use no fim do pipeline. | fal-ai/gpt-image-1.5, .../edit |
| Grok Imagine | $0.02 (gen) / $0.022 (edit) | Criativos esteticos baratos e simples de precificar. Estilo "aesthetic-first". | xai/grok-imagine-image, .../edit |
precisa de muita imagem barata? → gpt-image-1-mini
custo fixo previsivel + producao escala? → Gemini 2.5 Flash
prompt dificil / tipografia / composicao? → Gemini 3 Pro
fidelidade visual maxima + aderencia? → gpt-image-1.5
estetico bonito e barato? → Grok Imagine
Para feature visual importante:
Custo total tipico: $0.10-$0.50 por hero finalizado, dependendo de quantas iteracoes.
Ver docs/skill-guides/image-generator-models.md (carregado sob demanda) — schema completo de cada modelo, exemplos por SDK (Python fal-client, JS @fal-ai/client, cURL), parametros (aspect_ratio, quality, num_images, image_size, output_format, safety_tolerance, input_fidelity).
A skill nao impoe vendor. Alternativas:
Se mudar provider depois do projeto ter assets, registrar em ADR (docs/adr/) — mudanca de modelo provoca drift de estilo nos novos assets vs antigos.
Default (TS, funciona em qualquer máquina): scripts/generate-image.mjs do próprio kit. Zero-dep Node 18+, lê models/image-models.json como fonte única de verdade. Aplica a regra default automaticamente.
# text-to-image (usa grok-imagine $0.020)
node scripts/generate-image.mjs --prompt "minimalist hero, blue gradient" --aspect 16:9 --out public/hero.jpg
# edit/refine (usa gemini-25-flash $0.039, auto-detect via --ref)
node scripts/generate-image.mjs --prompt "remove background, sharp subject" --ref ./logo.png --out public/logo-clean.png
# override de model quando justificado
node scripts/generate-image.mjs --prompt "OG card with title" --model gpt-image-1.5 --aspect 16:9 --out public/og.png
# listar models e preços
node scripts/generate-image.mjs --list
Auth: FAL_AI_API_KEY em env (fallback: FAL_KEY, FAL_API_KEY).
Fallback Python (opcional, só pra usuários que já mantêm pipeline próprio): se o repo do usuário tiver script local (scripts/generate.py ou similar com mesma API), a skill pode usar — mas não tente importar paths de fora do repo do projeto (cada usuário tem caminhos diferentes; o kit não pode assumir nenhum). TS é sempre o default seguro.
Quando provider != FAL.AI: ajustar models/image-models.json no fork do projeto, ou criar adapter substituto seguindo a mesma interface (generateImage(opts) → {images, model, estimatedCostUsd}).
Preferencia de destino:
src-tauri/icons/ para assets nativos de Tauripublic/images/generated/ para web app com public/assets/images/ se a base do projeto usar assets/UI/UX (skill 02): confirma encaixe visual e composicaoAsset Librarian (skill 19): fornece inventario de assets, logos, fontes e tokens visuais existentesFrontend (skill 04): confirma uso real do asset e dimensoesSEO (skill 14): confirma necessidades de alt text e imagem publicaMobile Tauri (skill 15): confirma formatos e tamanhos para icones nativosWeb Asset Generator (skill 36): pega logo gerado por esta skill e deriva favicon multi-tamanho, PWA icons (maskable), Open Graph e Twitter card automaticamente. Handoff direto: quando esta skill cria logo, despachar skill 36 para gerar todos os assets web a partir dele.Orchestrator (skill 09): decide momento certo da geracao no pipelineCost Tracker (skill 30): registra custo por modelo + asset para evitar surpresa na fatura fal.aiEntregar sempre:
Seguir policies/handoffs.md e, quando util, templates/handoff.md.
Codigo deve priorizar clareza. Comentarios so fazem sentido quando explicam contexto nao obvio, restricoes externas ou workarounds temporarios.
npx claudepluginhub felvieira/claude-skills-fv --plugin dev-team-kit-fvCreates, edits, and optimizes marketing images using AI generation (Flux, Midjourney, Gemini) and design tools (Canva, Figma). Supports blog heroes, social graphics, product mockups, and brand assets.
Generates square PNG icons with transparent backgrounds for app icons, favicons, and UI using Google Gemini. Supports flat/3D/line/glyph/gradient/minimal styles, sizes 128-1024px, batch sets, reference matching.
Creates, edits, and optimizes marketing images using AI generation (Flux, Midjourney, DALL-E, Gemini, Stable Diffusion) and design tools (Canva, Figma). Handles blog heroes, social graphics, product mockups, banners, and brand assets.