Chevron
Animated chevron / zigzag stripe pattern
Animated chevron / zigzag stripe pattern
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| colorA | color | #000000 | First color |
| colorB | color | #ffffff | Second color |
| count | range | 5 | Number of chevron pairs visible |
| angle | range | 0 | Rotation angle of the chevrons |
| balance | range | 0.5 | Ratio of the two colors |
| softness | range | 0 | Edge softness |
| speed | range | 0 | Animation speed |
| offset | range | 0 | Phase offset for pattern positioning |
| colorSpace | "linear" | "oklch" | "oklab" | "hsl" | "hsv" | "lch" | linear | Color space for interpolation |
Usage
vue
<Shader>
<Chevron />
</Shader>