Instagram tarzı filtreler için ücretsiz CSS Code Generator

Sitenize görüntü filtreleri eklemek ne kadar havalı olur? Yıllar önce bu JavaScript gerektiriyordu ama bugünlerde eski HTML ve CSS ile özel görüntü filtreleri oluşturabilirsiniz.

Ve cssFilters webapp ile hiçbir CSS kodunu yazmak zorunda değilsiniz!

Bu ücretsiz araç, CSS3 filtreleri kullanarak özel görüntü filtreleri oluşturmanıza yardımcı olur. CSS filtre özelliğini kapsayan birçok kılavuz bulabilirsiniz. Ancak cssFilters ile tüm bunların nasıl çalıştığından endişe etmenize gerek kalmayacak, ayarlarınızı özelleştirip kodu kopyalayabilirsiniz.

Ekranın üst kısmında, özel Instagram filtreleriyle dolu uzun bir çubuk göreceksiniz. Bu filtreler, Hudson, Toaster, Inkwell, Lofi ve diğerleri gibi tüm popüler seçenekleri içerir..

İstediğiniz filtreyi tıklamanız yeterli. “CSS kodu” sağ üst köşedeki sekme. Oradan hem HTML hem de CSS kodunu alırsınız. Sadece web sitenize kopyalayın / yapıştırın ve gidebilirsiniz.

Ancak bu filtreleri ayar sürgüleriyle de özelleştirebilirsiniz. Altında “jeneratör” sekme, bulanıklık, gri tonlama, sepya ve hatta bir doğrusal degrade veya radyal degrade gibi bindirme stili ile birlikte doygunluk ve kontrast gibi ayarları değiştirebilirsiniz.

Bir kaydırıcıyı her hareket ettirdiğinizde kodu otomatik olarak günceller böylece herhangi bir şey kaydetmenize gerek kalmaz.

Ayrıca, bilgisayarınızdan bir tane yükleyerek veya Unsplash'tan bir tane seçerek varsayılan görüntüyü bile değiştirebilirsiniz..

Bu webapp, Indrashish Ghosh tarafından yapıldı ve CSSgram kütüphanesinde bulunan birçok varsayılan sınıfı çalıştırıyor.

Ancak özel ayarlar, temel ön ayarların çok ötesine gider ve serbest kod üretimi, kodlayıcılar ve kodlayıcı olmayanlar için kullanışlı bir araçtır. Arka plan gradyanları ve metin gölgeleri gibi özellikler için zaten birçok CSS3 üreticimiz var. Ve şimdi prömiyer CSS3 görüntü filtre üreteci olarak cssFilters var.