İki renk seçin, açıyı ayarlayın, hazır CSS kodunu kopyalayın. Doğrusal ve radyal geçişler, rastgele palet üretimi ve canlı önizleme.
Gradient oluşturucu, iki veya daha çok renk arasında yumuşak geçişler tasarlayıp CSS kodunu hazır verir. Doğrusal (linear) ve radyal (radial) geçişler, açı ayarı ve renk durakları ekleme desteklenir; arka plan, buton ve banner tasarımları için kullanılır.
İyi gradient genellikle birbirine yakın tonlarla yapılır; zıt renkler ortada çamurlu bir ara renk üretebilir. Üretilen linear-gradient(...) kodunu doğrudan CSS'nize yapıştırabilirsiniz. Tarayıcı uyumluluğu günümüzde evrenseldir, önek gerekmez.
Aracı kullanmak için JavaScript gerekli — bu sayfa yüklenirken otomatik açılır.
Kopyaladığınız 'background: linear-gradient(...)' satırını CSS dosyanızda hedef öğenin kuralına yapıştırmanız yeterli; tüm modern tarayıcılar destekler.
Doğrusal (linear) geçiş bir çizgi boyunca ilerler; radyal (radial) geçiş merkezden dışa dairesel yayılır. Buton ve kartlarda linear, spot ışık efektlerinde radyal tercih edilir.
Birbirine yakın tonlar (aynı rengin açık-koyu hali) her zaman şık durur. Zıt renklerde ara tonun çamurlaşmaması için doygunluğu yüksek tutun. 'Rastgele' butonu ilham için üretim yapar.
Tüm işlemler tarayıcınızda gerçekleşir; dosyalarınız hiçbir sunucuya yüklenmez.