Design und Assets
CSS Filter Generator
Erzeuge CSS filter values mit a visual effect preview.
Eingabe
CSS Filter Generator
css filterblurcontrastgenerator
Ausgabe
Generated CSS filter
Filter
blur(0px) brightness(1.08) contrast(1.12) saturate(1.2) hue-rotate(0deg)
.filter-preview {
width: min(100%, 340px);
border-radius: 24px;
overflow: hidden;
filter: blur(0px) brightness(1.08) contrast(1.12) saturate(1.2) hue-rotate(0deg);
box-shadow: 0 18px 36px rgba(15,23,42,0.14);
}
.filter-preview .hero {
min-height: 160px;
background: radial-gradient(circle at 20% 20%, #38bdf8, transparent 30%), radial-gradient(circle at 80% 30%, #8b5cf6, transparent 35%), linear-gradient(145deg, #111827, #0f172a);
}
.filter-preview .copy {
padding: 16px 18px;
background: white;
color: #0f172a;
}Filter preview
Live canvas
Ähnliche Tools
Box Shadow Generator
Erzeuge CSS box-shadow values mit custom offsets und blur.
Flexbox Generator
Erzeuge flex container CSS mit a live layout preview.
Border Radius Generator
Erzeuge border-radius CSS aus corner values.
CSS Grid Generator
Erzeuge CSS Grid layouts mit columns, gap, und row sizing.
CSS Button Generator
Erzeuge styled CSS button code.
CSS Transfürm Generator
Build CSS transfürm strings aus common transfürm values.