Frontend & UI
Impeccable
Zwei Dutzend Befehle, um Frontend-Interfaces zu bauen, zu kritisieren und zu verfeinern.
Worum es geht
Ein Frontend-Design-Skill mit Befehlen, gruppiert als build, evaluate, refine, enhance, fix und iterate. Er liest Projektkontext und eine Register-Referenz und schreibt dann produktionsreifen Code.
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
Warum das fürs Design zählt
- Die Register-Aufteilung schickt Marketingseiten und Produkt-UI durch unterschiedliche Designregeln.
- Absolute Verbote weisen Verlaufstext, Seitenstreifen-Rahmen und Eyebrow-Labels über jeder Section zurück.
- Kontrastuntergrenzen sind explizit: 4,5:1 für Fließtext, 3:1 für großen Text.
Was es abdeckt
- Setup
- Design guidance
- The AI slop test
- Commands
- Routing rules
- Hooks
So installierst du es
Impeccable
-
Klone das Repo.
git clone https://github.com/pbakaus/impeccable -
Verweise Codex auf die Skill-Datei.
plugin/skills/impeccable/SKILL.md -
Beschreibe dann das gewünschte UI. Codex folgt dem Skill.
So nutzt du es mit Codex
-
Führe context.mjs einmal pro Session aus, damit der Skill PRODUCT.md und DESIGN.md lädt.
-
Ruf einen Befehl wie critique, polish oder animate mit einer Zieldatei auf.
-
Nutze den Live-Modus mit laufendem Dev-Server, um Varianten im Browser zu erzeugen.
Jedes Plugin hier ist kostenlos, quelloffen und verlinkt auf seine echte Originalquelle.
Mehr auf der codex-design-Liste ↗Weitere Codex-Design-Plugins
Frontend & UI Was es macht gpt-taste Baut preisverdächtige Landingpages mit GSAP-Scroll-Motion und lückenlosen Bento-Grids. 
Design-Systeme Was es macht Stitch Design Taste Schreibt eine DESIGN.md, die Google Stitch zu nicht-generischen Screens lenkt. 
Frontend & UI Was es macht image-to-code Erzeugt zuerst Design-Bilder, analysiert sie und baut dann passenden Frontend-Code. 
Frontend & UI Was es macht imagegen-frontend-mobile Erzeugt hochwertige Mobile-App-Screen-Flows als Bilder, nicht als Code. Nächster Schritt
Mit Open Design designen, ohne Setup
Installiere dieses Plugin selbst, oder leg mit Open Design eine ganze kuratierte Design-Ebene um Codex. Eigener Key, eigenes Ergebnis.