▤

CSS Gradyan Oluşturucu

Doğrusal veya radyal bir gradyan oluşturun, canlı önizlemeyle görüp CSS'i kopyalayın.

Dosyalarınız bu cihazda kalır

Dosyalar tarayıcınızda işlenir, asla sunucuya yüklenmez. Site, araçları çalıştırmak için gereken kod ve kaynakları indirir. Hesap veya takip yoktur.

Bu aracı çevrimdışı kullanım için tek bir HTML dosyası olarak kaydetmek üzere İndir'i kullanın.

Gizlilik →

Tür

Açı (90°)

Renk 1 Konum 1 (0%)

Renk 2 Konum 2 (100%)

çıktı

Çözümlü bir örnek deneyin

Örnek

Doğrusal türü seçin, açıyı 135'e ve renkleri #ff7e5f ile #feb47b'ye ayarlayın. CSS şudur: background: linear-gradient(135deg, #ff7e5f 0%, #feb47b 100%);. İlk durağı 20'ye taşırsanız ilk renk kutunun ilk %20'sinde düz kalır.

Aklınızda bulunsun

0deg yukarıyı, 90deg sağı gösterir; bu yüzden 135deg sol üst köşeden sağ alt köşeye uzanır. Gradyan üzerinde metin varsa iki uç rengine karşı kontrastını kontrol edin.

Bu araç hakkında

Renkleri, konumları ve bir açıyı seçerek iki renkli doğrusal veya radyal bir gradyan oluşturun, ardından background kuralını kopyalayın. Canlı önizleme tamamen tarayıcınızda çalışır.

Sık sorulan sorular

Doğrusal gradyanda açı nedir?

Açı, renk geçişinin yönünü belirler: 0° yukarıyı, 90° sağı, 180° aşağıyı gösterir ve böyle devam eder.

Doğrusal yerine ne zaman radyal kullanmalıyım?

Renkleri bir merkez noktadan dışarı doğru yaymak için (bir spot ışık gibi) radyal kullanın; doğrusal ise renkleri düz bir çizgi boyunca harmanlar.