Sürüklenebilir çok duraklı kontrol ve seçilmiş ön ayarlarla sıfırdan lineer, radyal ve konik CSS degradeleri oluşturun. Yapıştırmaya hazır CSS'yi anında kopyalayın.

Canlı önizleme
Ön ayarlar
Degrade türü
Açı
°
Renk durakları
Bir durağı taşımak için bir tutamacı sürükleyin veya eklemek için çubuğa tıklayın. Rengini düzenlemek için bir durağı seçin.
Seçili durak
%
CSS
background: ;

Her şey tarayıcınızda canlı hesaplanır — kayıt yok, tamamen ücretsiz.


Degrade Oluşturucu Hakkında

Gradient Generator, sıfırdan özel CSS gradyanları oluşturur. Doğrusal, radyal veya konik bir tür seçin, açıyı ayarlayın ve karışımı çok duraklı bir düzenleyiciyle şekillendirin: durakları taşımak için tutamaçları sürükleyin, yenilerini eklemek için çubuğa tıklayın ve herhangi bir durağı bir seçiciyle yeniden renklendirin — canlı önizleme siz çalışırken güncellenir.

Küçültülmüş hazır şablonlar, boş bir sayfadan başlamak istemediğinizde size güçlü bir başlangıç noktası verir, tek tıkla eylemler — rastgele, tersine çevir, 45° döndür — keşfi hızlandırır. Üretilen CSS her zaman görünürdür ve önizlemeyle senkronize kalır, bu yüzden kopyaladığınız şey gördüğünüzün tam olarak aynısıdır.

Her şey ücretsiz olarak tarayıcınızda canlı hesaplanır. Tam CSS kuralını veya sadece background değerini kopyalayın ve bir stil sayfasına, düğme stiline veya hero bölümüne yapıştırın — arka planlar, kaplamalar ve UI vurguları için basit bir CSS gradyan oluşturucu.

Degrade Oluşturucu Nasıl Kullanılır

  1. Bir gradyan türü seçin: doğrusal, radyal veya konik.
  2. Bir şablondan başlayın veya anında bir başlangıç noktası için "Rastgele"ye tıklayın.
  3. Renkleri konumlandırmak için durak tutamaçlarını sürükleyin, durak eklemek için çubuğa tıklayın ve her durağın rengini düzenleyin.
  4. Açıyı ayarlayın veya karışımı yeniden yönlendirmek için "Tersine çevir" ve "45° döndür"ü kullanın.
  5. CSS kuralını veya background değerini kopyalayıp projenize yapıştırın.

Sıkça sorulan sorular

Evet. Araç tamamen istemci tarafındadır — kaç gradyan oluşturduğunuzda veya kopyaladığınızda kayıt, kredi veya sınır yoktur.

Doğrusal bir gradyan renkleri seçtiğiniz açıda düz bir çizgi boyunca karıştırır. Radyal bir gradyan bir merkez noktadan dışa doğru çemberler halinde yayılır. Konik bir gradyan renkleri bir merkez nokta etrafında bir pasta grafiği gibi süpürür; bu renk çemberleri ve ilerleme halkaları için harikadır.

Bir gradyan en az iki durak gerektirir ve daha fazlasını eklemek için çubuğa tıklamaya devam edebilirsiniz. Her durağın kendi rengi ve sürüklenebilir konumu vardır, bu yüzden karmaşık çok renkli karışımlar oluşturmak kolaydır.

Doğrusal ve radyal gradyanlar her yerde desteklenir. Konik gradyanlar tüm modern tarayıcılarda desteklenir ancak çok eski olanlarda desteklenmez, bu yüzden eski sürümleri desteklemeniz gerekiyorsa bir yedek background-color sağlayın.

Evet — yüklenen bir resmin baskın renklerini çıkarıp düzenlenebilir gradyan duraklarına dönüştüren eşlik eden Gradient Generator from Image aracını kullanın. Bu araç, sıfırdan başlayan karşılığıdır.


Popüler aramalar
gradyan oluşturucu css gradyan yapıcı doğrusal gradyan oluşturucu radyal gradyan yapıcı konik gradyan css ücretsiz gradyan oluşturucu
Yardıma mı ihtiyacınız var?
Bu araçta bir sorun mu buldunuz? Ekibimize bildirin.
Sorun bildir

Bu ücretsiz aracı kendi web sitenize ekleyin — aşağıdaki kodu kopyalayıp yapıştırın.