badges
Gradient border pill with glow
A pill/input system with a true 1px gradient border (double background using background-clip padding-box/border-box), plus a masked-ring variant built with mask-composite and a blurred glow behind it.
See it live and copy its promptWhat you can adjust
- Cool accent
- Warm accent
- Inner background
- Glow opacity
How this catalog works
Every component ships with its reproduction prompt: the text you paste into an AI builder to get exactly this piece. The values above are editable, and the prompt you copy carries the ones you chose, so what gets generated is what you were looking at.
