GradientText
GradientText Component
Playground
Gradient Text
Props
| Prop | Type | Default | Value |
|---|---|---|---|
| from | color | — | |
| to | color | — | |
| via | color | — | |
| direction | text | — | |
| as | selectspan | h1 | h2 | h3 | p | — |
Default
Gradient Text
CustomColors
Warm Gradient
ThreeColor
Three Colors
Heading
Heading Gradient
| PROP | TYPE | DEFAULT | DESCRIPTION |
|---|---|---|---|
as | select | — | HTML element |
direction | text | — | Gradient direction |
from | color | — | Start color |
to | color | — | End color |
via | color | — | Middle color |
Using GradientTexttsx
import { GradientText } from '@/components/GradientText'
<GradientText
from="..."
to="..."
via="..."
direction="..."
as="..."
/>Tokens Used
No design tokens detected