Tasarım & CSS

CSS Filter Üretici

10 fonksiyon ile CSS filter zincirini görsel olarak kur, görsel ve metin örneği üzerinde önizle, hazır şablonlardan seç, CSS, Tailwind, React inline, SCSS veya JSON olarak kopyala.

Canlı önizleme

Bir örnek görsel seç ya da kendi resmini sürükle bırak, sonra sağdan filtre zincirini ayarla.

Kaynak

Arka plan

Metin örneğini göster

Çevik kahverengi tilki

Aynı filtreyle tembel köpeğin üstünden zıplar

Hazır filtreler

Birine tıkla, zincire yüklesin — sonra ince ayar yap.

Filtre zinciri

2 / 12

Sıra önemli — tarayıcı yukarıdan aşağıya uygular.

#1
Bulanıklık
px
#2
Doygunluk

Kod çıktısı

CSS, Tailwind, React inline, SCSS değişkeni veya JSON.

filter: blur(2px) saturate(1.3);