image-to-code

Worum es geht

Ein bildgetriebener Workflow für visuelle Web-Aufgaben. Der Agent erzeugt Referenzbilder je Section, extrahiert daraus Typografie, Abstände, Farbe und Komponenten und baut die Seite passend dazu.

Elite website image-to-code skill for Codex. For visually important web tasks, it must first generate the design image(s) itself, deeply analyze them, then implement the website to match them as closely as possible. In C

Warum das fürs Design zählt

• Der Code folgt einer echten visuellen Referenz, damit die Umsetzung nicht in generische Layouts abdriftet.
• Jede Section bekommt ein eigenes großes Bild, sodass Text und Abstände analysierbar bleiben.
• Heros bleiben unter drei Headline-Zeilen und frei von verschachtelten Container-Stapeln.

Was es abdeckt

• Mandatory image-first rule
• Generate enough images rule
• Deep image analysis requirement
• Hero minimalism rules
• Anti-drift implementation rule
• Anti-AI-slop rules