Search documentation

Find a vivid-layer page or product.

Neuro Noise

A luminous web of fluid lines for atmospheric AI and technology surfaces.

pnpm dlx shadcn@latest add @vivid-layer/neuro-noise

Customize

Brightness
0.05
Contrast
0.3
Speed
1
Scale
1
Rotation
0

API reference

The wrapper adds playback and accessible runtime defaults while preserving the complete Paper NeuroNoise API. This includes frame, scale, rotation, offsets, fit controls, pixel-ratio controls, styles, and every shader-specific prop. See the Paper Neuro Noise reference for the full upstream prop table and accepted ranges.

PropTypeDefaultDescription
playback"auto" | "always" | "paused""auto"Controls motion policy. Auto pauses for reduced motion and while the shader is outside the viewport; paused fixes the effective speed at zero.
colorFrontstring"#b8f3ff"Sets the highlight color at the brightest line intersections.
colorMidstring"#7357ff"Sets the main color of the fluid line structure.
colorBackstring"#09081a"Sets the background color. The curated default uses a near-black violet.
brightnessnumber0.08Controls luminosity at crossing points from 0 to 1.
contrastnumber0.45Controls the sharpness of bright-to-dark transitions from 0 to 1.
speednumber0.2Sets the base animation rate. Playback can resolve the effective speed to zero without changing this value.
scalenumber0.85Sets the default zoom level while remaining fully overridable through the Paper API.
width / heightnumber | string"100%"Sets the canvas CSS dimensions. Size the parent element to establish the visible area.
maxPixelCountnumber2073600Caps the rendered pixel budget. Override only after measuring the target devices.

Credits

The rendering engine is Paper Shaders, distributed under the Apache License 2.0. vivid-layer supplies the React adapter, defaults, playback policy, documentation, and Registry packaging; it does not vendor or modify Paper's shader source.