Spiral
Rotating spiral pattern with animated movement
Rotating spiral pattern with animated movement
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| colorA | color | #000000 | Background color |
| colorB | color | #ffffff | Spiral stroke color |
| strokeWidth | range | 0.5 | Thickness of spiral stroke |
| strokeFalloff | range | 0 | Stroke losing width further from center |
| softness | range | 0 | Color transition sharpness (0 = hard edge, 1 = smooth fade) |
| speed | range | 1 | Animation speed (negative values reverse direction) |
| center | position | {"x":0.5,"y":0.5} | The center point of the spiral |
| scale | range | 1 | Scale factor for spiral bands (higher = more bands, lower = fewer bands) |
| colorSpace | "linear" | "oklch" | "oklab" | "hsl" | "hsv" | "lch" | linear | Color space for color interpolation |
Usage
vue
<Shader>
<Spiral />
</Shader>