Design-Systeme
Beautiful Shadows
Drei fertige Tailwind-Shadow-Utilities für neutrale, gestapelte Elevation.
Worum es geht
Ein Set exakter Tailwind-Arbitrary-Shadow-Klassen in drei Stärken. Jede stapelt mehrere neutrale Ebenen mit geringer Deckkraft statt Tailwinds Standard-Shadow-Skala.
Apply exact Tailwind arbitrary shadow utilities for polished, layered neutral elevation. Use when compact cards, controls, panels, popovers, hero media, feature callouts, or modal-like containers need refined shadows wit
Warum das fürs Design zählt
- Die Elevation bleibt neutral, kein farbiges Glühen färbt die Fläche darunter.
- Drei feste Stärken sind Controls, Karten und Hero-Media zugeordnet.
- Gestapelte Ebenen mit geringer Deckkraft wirken wie echte Tiefe statt eines plumpen Schlagschattens.
Was es abdeckt
- Use when
- Shadow utilities
- Examples
- Usage rules
- Avoid
So installierst du es
Beautiful Shadows
-
Klone das Repo.
git clone https://github.com/MengTo/Skills -
Verweise Codex auf die Skill-Datei.
agent-skills/web-design/beautiful-shadows/SKILL.md -
Beschreibe dann das gewünschte UI. Codex folgt dem Skill.
So nutzt du es mit Codex
-
Bitte Codex, die md-Utility auf Karten, Panels und Popovers anzuwenden.
-
Reservier die lg-Utility für Hero-Media und modalartige Container.
-
Kombiniere jeden Schatten mit einer sauberen Flächenfüllung und konsistentem Radius.
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.