Gradient border chips
The active chip gets a slowly spinning gradient ring, and the others glow softly when you hover them.
Settings
Code
<div class="uv-fcg"><button>All</button><button class="on">Design</button><button>Code</button><button>Photos</button><button>Video</button></div>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Filters
Where to use it
This one likes dark backgrounds. Think of a festival site where people filter the line-up by stage or by genre, or a gaming shop sorting titles by platform. The turning ring marks the chosen option without filling it, so the chip text stays easy to read. A good match for anyone after gradient border buttons in CSS.
Pick two colours that are close on the wheel, like violet and pink, and the ring looks rich instead of loud. Only one chip should spin at a time. On a light, minimal store it may feel out of place, so try it in context first.