Frontend e UI
Hallmark
Flusso di design anti-sciatteria con 58 controlli e varietà strutturale forzata.
Che cos’è
Una skill di design per assistenti di coding AI, con un flusso di build predefinito e tre verbi: audit, redesign e study. Spinge verso la varietà strutturale così due build non condividono lo stesso ritmo di pagina.
Anti-AI-slop design skill for greenfield pages, audits, redesigns, and design extraction from URLs or screenshots. Use when the user asks to build a new app or landing page, wants to redesign something, invokes Hallmark
Perché conta per il design
- Le regole di diversificazione impongono macrostrutture, nav e footer diversi tra build consecutive.
- I token bloccati vietano valori hex o font-family inline che aggirano il blocco dei token.
- Ogni output viene verificato alle larghezze di 320, 375, 414 e 768 pixel.
Cosa copre
- How to use this skill
- Disciplines that hold across every verb
- When the brief is a component, not a page
- Design flow (default)
- Hallmark study
- Output contract and scope
Come installarlo
Hallmark
-
Clona il repository.
git clone https://github.com/Nutlope/hallmark -
Punta Codex sul file della skill.
skills/hallmark/SKILL.md -
Poi descrivi la UI che vuoi. Codex segue la skill.
Come usarlo con Codex
-
Lascia che la scansione di pre-flight legga prima font, palette e librerie di movimento esistenti.
-
Rispondi ai controlli su pubblico, caso d’uso e tono, oppure dì di procedere.
-
Esegui hallmark audit su una pagina per una lista di interventi ordinata, senza modifiche.
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.