ComponentsEffects
Gradient
A two-stop gradient surface that breathes between ramps
Release 0.11
Ship faster with panels
Usage
import { Gradient } from "@gpuixui/components/gradient";
<Gradient
from="#7C5CFF"
to="#101014"
angle={120}
shift={80}
style={{ padding: 32 }}
>
<text>Ship faster with panels</text>
</Gradient>;API
| Prop | Type | Default |
|---|---|---|
from | string | theme primary |
to | string | from at zero alpha |
angle | number | 135 |
shift | number | 90 |
durationMs | number | 6_000 |
radius | number | 0 |
level | MotionLevel | "slow" |
className | string | — |
style | StateStyle<GradientState> | — |
children | ReactNode | — |
Edit this page on GitHubpackages/components/docs/gradient.mdx