Frontend & UI Was es macht gpt-taste Baut preisverdächtige Landingpages mit GSAP-Scroll-Motion und lückenlosen Bento-Grids. Kuratierte Sammlung
Die Design-Plugins, mit denen Codex echtes UI liefert
OpenAI Codex schreibt funktionierenden Code. Sich selbst überlassen landet er bei sicheren Fonts, mittelmäßigen Abständen und zentrierter Helvetica. Diese Plugins geben ihm Geschmack: ästhetische Skills und Design-System-Regeln. Installiere eins davon, oder nutze alle in Open Design.
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.
Frontend & UI Was es macht imagegen-frontend-web Erzeugt ein horizontales Referenzbild pro Section einer Landingpage.
Frontend & UI Was es macht minimalist-ui Baut warme, monochrome Editorial-Interfaces mit flachen Bento-Grids.
Frontend & UI Was es macht design-taste-frontend Liest das Briefing, wählt eine Richtung, liefert Interfaces ohne Templates.
Design-Systeme Was es macht industrial-brutalist-ui Baut strenge Interfaces im Schweizer Print-Stil oder als CRT-Terminal mit analogem Korn.
Frontend & UI Was es macht redesign-existing-projects Prüft eine bestehende Seite und wertet sie auf, ohne die Funktion zu brechen.
Design-Systeme Was es macht brandkit Erzeugt Brand-Guideline-Boards, Logo-Systeme und Identity-Decks als Bilder.
Frontend & UI Was es macht high-end-visual-design Blockiert generische KI-Defaults und erzwingt Layout und Motion auf Agenturniveau.
Frontend & UI Was es macht pick-ui-library Ordnet einer Frontend-Aufgabe genau eine kuratierte, meinungsstarke Bibliothek zu.
Frontend & UI Was es macht apple-design Apples fluide Interface-Prinzipien, übersetzt in Web-Springs und Gesten.
Frontend & UI Was es macht animation-vocabulary Macht aus einer vagen Motion-Beschreibung den exakten Fachbegriff.
Frontend & UI Was es macht emil-design-eng Emil Kowalskis Regeln für Animations-Timing, Easing und Komponenten-Feinschliff.
Design-Systeme Was es macht UI-UX Pro Max · Design Ein Einstiegspunkt, der Logo-, Identity-, Slide-, Banner- und Icon-Arbeit verteilt.
Frontend & UI Was es macht UI-UX Pro Max · Banner Design Gestaltet maßgenaue Banner in HTML und exportiert sie dann als PNGs.
Frontend & UI Was es macht UI-UX Pro Max · UI Styling Baut barrierefreie Interfaces mit shadcn-Komponenten und Tailwind-Utilities.
Design-Systeme Was es macht UI-UX Pro Max · Brand Hält Brand-Guidelines, Design-Tokens und Assets synchron.
Frontend & UI Was es macht UI-UX Pro Max · Slides Baut HTML-Präsentationsdecks mit Chart.js und Layout-Patterns.
Design-Systeme Was es macht UI-UX Pro Max · Design System Dreischichtige Design-Tokens, Komponenten-Specs und token-konforme Slide-Generierung.
Frontend & UI Was es macht design-skills · Editorial Magazin-Layout in Gelasio-Serif auf einem strikten 8pt-Raster.
Frontend & UI Was es macht design-skills · Terracotta Terrakotta-Akzent auf Creme, DM-Serif-Display-Headlines, für Langtexte.
Frontend & UI Was es macht design-skills · Dithered Punktmuster-Schattierung und eine begrenzte Palette für retro, kontraststarke Screens.
Frontend & UI Was es macht design-skills · Neumorphism Weich extrudierte Flächen in Steingrau mit Space-Mono-Schrift.
Frontend & UI Was es macht design-skills · Bento Raster aus unterschiedlichen Blöcken auf Creme, Inter-Schrift, kompakte Skala.
Frontend & UI Was es macht design-skills · Claymorphism Pralle, runde 3D-Formen, Poppins-Headlines, Blau auf Weiß.
Frontend & UI Was es macht design-skills · Brutalism Rohbeton-inspirierte Layouts, Darker-Grotesque-Display, Rot und Ocker.
Frontend & UI Was es macht Hallmark Anti-Slop-Design-Flow mit 58 Gates und erzwungener struktureller Vielfalt.
Frontend & UI Was es macht Impeccable Zwei Dutzend Befehle, um Frontend-Interfaces zu bauen, zu kritisieren und zu verfeinern.
Design-Systeme Was es macht Design DNA Extrahiere ein Referenzdesign in strukturiertes JSON und generiere daraus.
Design-Systeme Was es macht Material 3 Setze Googles Material Design 3 über Compose, Flutter und Web um.
Frontend & UI Was es macht Details that make interfaces feel better Sechzehn konkrete UI-Feinschliff-Regeln mit Review-Checkliste.
Frontend & UI Was es macht Agent-Native Plans Macht aus Text-Plänen prüfbare Dokumente mit Wireframes und Prototypen.
Design-Systeme Was es macht Kami Setzt Lebensläufe, Whitepaper, Decks und Landingpages in einer Designsprache.
Frontend & UI Was es macht Border Gradients Feine Verlaufskanten für Karten, Panels und Navigationsleisten.
Frontend & UI Was es macht Masked Reveal Enthüllt Headlines Wort für Wort durch eine Overflow-Maske beim Scrollen.
Frontend & UI Was es macht Framed Grid Layout Baut präzise Editorial-Layouts mit dünnen Rahmen und Eckwinkeln.
Frontend & UI Was es macht Container Lines Zeichnet dezente vertikale Hilfslinien an den Kanten deines Content-Containers.
Frontend & UI Was es macht Skeuomorphic UI Gibt Buttons und Panels taktile Tiefe mit gestapelten Verläufen und Schatten.
Design-Systeme Was es macht Beautiful Shadows Drei fertige Tailwind-Shadow-Utilities für neutrale, gestapelte Elevation.
Frontend & UI Was es macht Dither Background Canvas-Hintergrund mit sichtbarem 4x4-Bayer-Dithering und quadratischen Pixeln.
Frontend & UI Was es macht WebGL Laser Vollbild-Shader-Strahl mit weißglühendem Kern und markengetöntem Nebel.
Design-Systeme Was es macht Mesh Gradient Dark Blue Clean Fast schwarzes Navy-System mit einem Mesh-Feld in einer Hero-Hülle.
Frontend & UI Was es macht Cinematic Scroll Storytelling Scroll-getriebene Narration: Lenis, ScrollTrigger, Sticky-Stapel.
Design-Systeme Was es macht Agency Grid Layout Minimal Editoriales Mehrspalten-Raster mit übergroßen Headlines und winzigen Großbuchstaben-Labels.
Design-Systeme Was es macht Glass Dark Mode Clock Dunkle, mattierte Flächen rund um eine runde Kalibrierungsskala.
Frontend & UI Was es macht WebGL 3D Object Ein echtes, beleuchtetes 3D-Hero-Objekt statt CSS-Transform-Trick.
Frontend & UI Was es macht GSAP Skills Offizielles GSAP-Animations-Set, von Core-Tweens über ScrollTrigger bis React.
Frontend & UI Was es macht Animation Review Motion finden, verbessern und gegen eine Senior-Craft-Latte prüfen. Nächster Schritt
Spar dir das Setup. Designe mit Codex in Open Design
Open Design ist der quelloffene, agent-native Design-Workspace rund um Codex. Er hält Systeme, Skills und Templates konsistent, damit der Agent Arbeit liefert, die dir gehört.