Frontend e UI
Impeccable
Due dozzine di comandi per costruire, criticare e rifinire interfacce frontend.
Che cos’è
Una skill di design frontend con comandi raggruppati in build, evaluate, refine, enhance, fix e iterate. Legge il contesto del progetto e un riferimento di registro, poi scrive codice di livello produzione.
Use when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a frontend interface. Covers websites, landing page
Perché conta per il design
- La divisione per registro manda pagine marketing e UI di prodotto verso regole di design diverse.
- I divieti assoluti rifiutano testo in gradiente, bordi a striscia laterale ed etichette eyebrow sopra ogni sezione.
- Le soglie minime di contrasto sono esplicite: 4.5:1 per il corpo del testo, 3:1 per il testo grande.
Cosa copre
- Setup
- Design guidance
- The AI slop test
- Commands
- Routing rules
- Hooks
Come installarlo
Impeccable
-
Clona il repository.
git clone https://github.com/pbakaus/impeccable -
Punta Codex sul file della skill.
plugin/skills/impeccable/SKILL.md -
Poi descrivi la UI che vuoi. Codex segue la skill.
Come usarlo con Codex
-
Esegui context.mjs una volta per sessione così la skill carica PRODUCT.md e DESIGN.md.
-
Invoca un comando come critique, polish o animate con un file di destinazione.
-
Usa la modalità live con un dev server attivo per generare varianti nel browser.
Ogni plugin qui è gratuito, open source e rimanda alla sua vera fonte upstream.
Altro sulla lista codex-design ↗Altri plugin di design per Codex
Frontend e UI Cosa fa gpt-taste Costruisce landing page da premio con motion GSAP legato allo scroll e griglie bento senza vuoti. 
Design system Cosa fa Stitch Design Taste Scrive un DESIGN.md che guida Google Stitch verso schermate non generiche. 
Frontend e UI Cosa fa image-to-code Genera prima immagini di design, le analizza, poi costruisce il codice frontend corrispondente. 
Frontend e UI Cosa fa imagegen-frontend-mobile Genera flussi di schermate per app mobile di livello premium come immagini, non come codice. Prossimo passo
Progetta con Open Design, senza il setup
Installa questo plugin da solo, oppure porta attorno a Codex un intero strato di design curato con Open Design. Usa la tua chiave, resta padrone dell’output.