Design system
Material 3
Implementa Material Design 3 di Google su Compose, Flutter e web.
Che cos’è
Una guida a Material Design 3 che copre il namespace di token md.sys, oltre 30 componenti, layout adattivo, theming e M3 Expressive. Jetpack Compose è il target principale; Flutter e @material/web sono secondari.
>
Perché conta per il design
- I token di colore, tipografia, forma ed elevazione sostituiscono i valori hex e di raggio scritti a mano.
- Le superfici tonali reggono la profondità al posto delle ombre, in linea con la spec MD3 attuale.
- Un audit a punteggio valuta dieci categorie ed elenca le correzioni in ordine di priorità.
Cosa copre
- Design token system
- Component quick reference
- Common patterns
- Anti-patterns
- M3 Expressive
- MD3 compliance audit
Come installarlo
Material 3
-
Clona il repository.
git clone https://github.com/hamen/material-3-skill -
Punta Codex sul file della skill.
skills/material-3/SKILL.md -
Poi descrivi la UI che vuoi. Codex segue la skill.
Come usarlo con Codex
-
Indica la piattaforma così Codex sceglie Compose, Flutter o le CSS custom properties.
-
Chiedi un componente e ottieni la variante corretta più il collegamento dei token.
-
Esegui l’audit su un URL o su file sorgente per un report di conformità.
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.