hover-lift, gradient-text, gradient-neon, gradient-pastel, gradient-nature, gradient-brutalist.
Usage#
<h1 class="gradient-text">Headline</h1>The classes#
| Class | Purpose |
|---|---|
hover-lift | Rise + shadow on hover |
gradient-text | Gradient-filled text |
gradient-neon/pastel/nature/brutalist | Paradigm gradient presets |
Compose with utilities#
<a class="hover-lift inline-block p-6 glass rounded-xl" href="#">Lifts</a>Customization#
Every component is built from theme tokens (colors, blur radii, shadows). Redefine tokens in your config and the whole family restyles. For structural changes, copy the rules into your own layer and edit freely.
Accessibility#
- hover-lift must also be reachable by keyboard focus
Related#
components/index|Components hub · themes/index|Themes · recipes/index|Recipes