← DOCS
overlays

NoiseOverlay

SVG fractal noise texture overlay for film grain effect.

npx chaos add noise-overlay

PREVIEW

NOISE

USAGE

case 'glass-button': return ; case 'neon-glow': return ; case 'floating-button': return ;
import { NoiseOverlay } from '@oalacea/chaosui/overlays/noise-overlay';

<NoiseOverlay />
<NoiseOverlay animated opacity={0.08} />
<NoiseOverlay frequency={1.2} blendMode="multiply" />

PROPS

PropTypeDefault
opacityNoise opacity
number0.05
frequencyNoise frequency (higher = finer)
number0.8
animatedEnable animation
booleanfalse
blendModeCSS blend mode
string"overlay"
positionPosition type
"fixed" | "absolute""fixed"