Documentation

GuidesComponents

FallingLines

Directional falling lines with a leading-to-trailing color fade

Props

colorAstring
Default:#ffffff
Color at the leading edge of each line
colorBstring
Default:#ffffff00
Color at the trailing edge (transparent by default)
colorSpace"linear" | "oklch" | "oklab" | "hsl" | "hsv" | "lch"
Default:linear
Color space for interpolation between lead and trail colors
anglenumber
Default:90
Direction of movement in degrees (90=down, 270=up, 0=right, 180=left)
speednumber
Default:0.5
Movement speed
speedVariancenumber
Default:0.3
Per-line speed variance (0=uniform, 1=high variance)
densitynumber
Default:15
Number of line columns across the canvas
trailLengthnumber
Default:0.35
Streak length relative to spacing (0=point, 1=continuous)
balancenumber
Default:0.5
Color mix midpoint (0.5=linear, 0=all trailing/colorB, 1=all leading/colorA)
strokeWidthnumber
Default:0.15
Line thickness as fraction of column width (0=hairline, 1=full width)
roundingnumber
Default:1
Rounds the leading edge (0=flat/square, 1=fully rounded cap)

Usage

<Shader>
  <FallingLines />
</Shader>
Previous
Emboss
Next
FilmGrain