Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/paper-design/shaders/llms.txt

Use this file to discover all available pages before exploring further.

A glowing, web-like structure of fluid lines and soft intersections. The pattern is built from 15 layers of rotating sinusoidal accumulation, producing bright crossing points that fade into a dark background. Great for creating atmospheric, organic-yet-futuristic visuals.

​
Usage

import { NeuroNoise } from '@paper-design/shaders-react';

export default function Example() {
  return (
    <NeuroNoise
      colorFront="#ffffff"
      colorMid="#47a6ff"
      colorBack="#000000"
      brightness={0.05}
      contrast={0.3}
      speed={1}
      style={{ width: '100%', height: '100%' }}
    />
  );
}

​
Props

​
colorFront
string
default:"#ffffff"
Highlight color applied at the brightest crossing points.
​
colorMid
string
default:"#47a6ff"
Main color of the network lines.
​
colorBack
string
default:"#000000"
Background color.
​
brightness
number
default:"0.05"
Luminosity of the crossing intersection points. Range: 0 to 1.
​
contrast
number
default:"0.3"
Sharpness of the bright-to-dark transition. Range: 0 to 1.
​
speed
number
default:"1"
Animation speed multiplier. Set to 0 to pause.
​
frame
number
default:"0"
Static frame position when speed is 0.

​
Presets

NameDescription
DefaultBlue neural network on black
SensationVivid cyan and yellow on purple
BloodstreamRed veins on white
GhostMonochrome high-contrast web

​
Sizing

This shader uses ShaderSizingParams. See Sizing and fit for fit, scale, rotation, offsetX, offsetY, originX, originY, worldWidth, and worldHeight props.