Noise Type
Noise Settings
3
2
Overlay
15%
Preview
Noise Texture
perlin · 0.65 freq · 3 octaves
Generated CSS
.element {
position: relative;
background-color: #6366f1;
}
.element::after {
content: '';
position: absolute;
inset: 0;
opacity: 0.15;
mix-blend-mode: overlay;
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'> <filter id='noise' x='0%' y='0%' width='100%' height='100%'> <feTurbulence type='fractalNoise' baseFrequency='0.650' numOctaves='3' seed='2' stitchTiles='stitch'/> </filter> <rect width='200' height='200' filter='url(%23noise)' opacity='1'/> </svg>");
background-size: 200px 200px;
pointer-events: none;
}