Uma imagem por seção
Referências visuais de site, com uma regra de saída inegociável.
imagegen-frontend-web- Peso
- massivo
- 988 linhas · 600+ linhas
- Gatilho
- o agente chama
- O agente dispara sozinho quando a descrição bate com a tarefa.
- Encaixe
- 1 conflito
- Combina com 2 outras.
O que ela faz
A regra em maiúsculas no topo da skill: uma imagem horizontal separada para cada seção. Oito seções, oito imagens — nunca comprimir várias numa só. Força variedade de composição, escalas de hero diferentes e uma paleta consistente entre todas.
Quando não usar
Gera imagem, não código. Passe o resultado para image-to-code.
Aparece em
Ficha técnica
- Descrição original
- Elite frontend image-direction skill for generating premium, conversion-aware website design references. CRITICAL OUTPUT RULE — generate ONE separate horizontal image FOR EVERY section. A landing page with 8 sections produces 8 images. Never compress multiple sections into one image. Enforces composition variety (not always left-text / right-image), background-image freedom, varied CTAs, varied hero scales (giant / mid / mini minimalist), narrative concept spine, second-read moments, and a single consistent palette across all images. Optimized for landing pages, marketing sites, and product comps that developers or coding models can accurately recreate.
- Caminho no repo
skills/imagegen-frontend-web/SKILL.md- SKILL.md
- 988 linhas
- Seções
- 1. ACTIVE BASELINE CONFIGURATION · 2. THE COMBINATORIAL VARIATION ENGINE · 3. FRONTEND REFERENCE RULE · 4. HERO MINIMALISM RULES · 5. IMAGE COUNT & PAGE SLICING · 6. CREATIVITY ESCALATION RULE · 7. IMAGE-FIRST ART DIRECTION · 8. ANTI-AI-SLOP RULES · 9. TYPOGRAPHY-FIRST DISCIPLINE · 10. SECTION RHYTHM RULE · 11. COMPONENT EXECUTION GUIDELINES · 12. DENSITY & SPACING DISCIPLINE · 13. COLOR & MATERIAL RULES · 14. IMAGE / MEDIA DIRECTION
Instalar — vem com o pacote inteiro (13 skills)
CLI skills
No terminal, de qualquer diretório.
npx skills add Leonxlnx/taste-skill
Quatro das treze declaram registros estéticos que se contradizem. Instale o pacote, escolha uma.
→O que essa instalação faz na sua máquinaFechar
Como o método funciona
O gerenciador da Vercel Labs. Usa o GitHub como registro, copia para ~/.agents/skills e cria symlink para cada agente instalado na máquina.
Precisa ter
- Node 18+
- Geração de imagem para as skills de imagegen
Onde cai no disco
~/.agents/skills/ + symlink em ~/.claude/skills/
Sair
npx skills remove Leonxlnx/taste-skillDo mesmo pacote