🎨 SVG Noise Generator

Generate SVG noise patterns using feTurbulence and feDisplacementMap filters

Settings

Noise Type

Base Frequency: 0.050

Octaves: 3

Opacity: 0.30

Color

Width

Height

Preview

SVG Code

<svg width="400" height="400" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <filter id="noiseFilter">
      <feTurbulence
        type="fractalNoise"
        baseFrequency="0.05"
        numOctaves="3"
        result="turbulence" />
      <feColorMatrix
        in="turbulence"
        type="matrix"
        values="0 0 0 0 0
                0 0 0 0 0
                0 0 0 0 0
                0 0 0 0.3 0" />
    </filter>
  </defs>
  <rect width="400" height="400" fill="#3b82f6" filter="url(#noiseFilter)" />
</svg>