Frontend & UI
Border Gradients
Feine Verlaufskanten für Karten, Panels und Navigationsleisten.
Worum es geht
Ein Skill für Oberflächendetails: dezente Verlaufsränder für Karten, Preis-Panels, Navigationsleisten, Modals, Buttons und Hero-Flächen, ganz ohne lautes Glühen.
Apply subtle gradient-border treatments for premium web surfaces. Use when cards, pricing panels, nav bars, modals, buttons, or hero surfaces need a refined edge highlight without a loud glow.
Warum das fürs Design zählt
- Die Kante entscheidet, ob eine Fläche premium wirkt oder nach schlichtem Rahmenkasten aussieht.
- Kodiert Geschmacksregeln, damit der Effekt dezent bleibt und nicht in Neon kippt.
- Bringt eine Tailwind-Abkürzung mit und passt so in einen bestehenden Stack.
Was es abdeckt
- Use when
- Defaults
- Simple CSS pattern
- Masked pattern
- Tailwind shortcut
- Taste rules
So installierst du es
Border Gradients
-
Klone das Repo.
git clone https://github.com/MengTo/Skills -
Verweise Codex auf die Skill-Datei.
agent-skills/web-design/css-border-gradient/SKILL.md -
Beschreibe dann das gewünschte UI. Codex folgt dem Skill.
So nutzt du es mit Codex
-
Klone das Repo und verweise Codex auf diese Skill-Datei.
-
Frag nach der Komponente. Der Skill liefert die Kantenbehandlung.
-
Wähle je nach Fläche das einfache oder das maskierte Muster.
Jedes Plugin hier ist kostenlos, quelloffen und verlinkt auf seine echte Originalquelle.
Mehr auf der codex-design-Liste ↗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.