Twilight Lines

Soft glowing lines that pulse with a warm sweep

twilight-lines-tw

Customize

Tweak the props live

Line Count2

Wave Amplitude0.5

Wave Frequency1.8

Line Thickness0.05

Line Glow0.01

Line Color

#4D33CC

Line Intensity3

Pulse Color

#CC4D4D

Pulse Speed0.25

Pulse Width35

Pulse Intensity5.5

Chromatic Aberration0.05

Opacity1

Background

#FFFFFF

Props

Name	Type	Default	Description
`width`	string \| number	`"100%"`	Container width
`height`	string \| number	`"100%"`	Container height
`className`	string	`""`	Additional CSS classes
`children`	ReactNode	`undefined`	Content rendered above the effect
`lineCount`	number	`2`	Number of horizontal lines stacked across the canvas
`waveAmplitude`	number	`0.5`	Vertical sway amplitude applied to every line
`waveFrequency`	number	`1.8`	Spatial frequency of the horizontal sway
`lineThickness`	number	`0.05`	Floor of the line distance — controls visible thickness
`lineGlow`	number	`0.01`	Numerator of the inverse-distance glow term
`lineColor`	string	`"#4D33CC"`	Hex color of the lines
`lineIntensity`	number	`3`	Brightness multiplier for the lines
`pulseColor`	string	`"#CC4D4D"`	Hex color of the warm flash sweeping along the lines
`pulseSpeed`	number	`0.25`	Speed and frequency of the sweeping flash
`pulseWidth`	number	`35`	Bell width of the flash — larger = wider hot spot
`pulseIntensity`	number	`5.5`	Brightness multiplier for the flash
`chromaticAberration`	number	`0.05`	Strength of the radial RGB split applied to the composite
`backgroundColor`	string	`"#000000"`	Hex background fill color
`opacity`	number	`1`	Master alpha (0–1)
`dpr`	number	`1.5`	Maximum device pixel ratio

widthstring | number

Container width

Default:"100%"

heightstring | number

Container height

Default:"100%"

classNamestring

Additional CSS classes

Default:""

childrenReactNode

Content rendered above the effect

Default:undefined

lineCountnumber

Number of horizontal lines stacked across the canvas

Default:2

waveAmplitudenumber

Vertical sway amplitude applied to every line

Default:0.5

waveFrequencynumber

Spatial frequency of the horizontal sway

Default:1.8

lineThicknessnumber

Floor of the line distance — controls visible thickness

Default:0.05

lineGlownumber

Numerator of the inverse-distance glow term

Default:0.01

lineColorstring

Hex color of the lines

Default:"#4D33CC"

lineIntensitynumber

Brightness multiplier for the lines

Default:3

pulseColorstring

Hex color of the warm flash sweeping along the lines

Default:"#CC4D4D"

pulseSpeednumber

Speed and frequency of the sweeping flash

Default:0.25

pulseWidthnumber

Bell width of the flash — larger = wider hot spot

Default:35

pulseIntensitynumber

Brightness multiplier for the flash

Default:5.5

chromaticAberrationnumber

Strength of the radial RGB split applied to the composite

Default:0.05

backgroundColorstring

Hex background fill color

Default:"#000000"

opacitynumber

Master alpha (0–1)

Default:1

dprnumber

Maximum device pixel ratio

Default:1.5