Görüntüden Degrade Oluşturucu

Tüm araçlar

Herhangi bir fotoğraftan güzel bir degrade çıkarın — görüntüyü bırakın, bir ruh hali seçin ve baskın renkler sürüklenebilir degrade duraklarına dönüşsün. Yapıştırmaya hazır CSS'yi anında kopyalayın.

Görüntüyü buraya sürükleyip bırakın

veya göz atmak için tıklayın — panonuzdan yapıştırabilirsiniz

Her şey tarayıcınızda çalışır — görüntünüz hiçbir zaman yüklenmez, kayıt yok, tamamen ücretsiz.

Kaynak görüntü
Renkler okunuyor…
Kaynak görüntü
Ruh hali
Çıkarılan renkler
Bunlar görüntünüzden çekilen baskın renklerdir. Kopyalamak için bir renk kartına tıklayın veya degradeyi ince ayar için aşağıdaki duraklara sürükleyin.
Degrade önizleme
Degrade türü
Açı
°
Renk durakları
Bir durağı yeniden konumlandırmak 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: —;

Görüntüden Degrade Oluşturucu Hakkında

Gradient Generator from Image, herhangi bir fotoğrafı kullanıma hazır bir CSS gradyanına dönüştürür. Bir görüntü bırakın, göz atın veya yapıştırın; araç onu bir tuval üzerinde okur, baskın renklerini çıkarır ve orijinalin hissiyatına uyana kadar sürükleyebileceğiniz, yeniden renklendirebileceğiniz ve yeniden sıralayabileceğiniz gradyan durakları olarak yerleştirir.

Bir ruh hali seçici — Renkli, Parlak, Soluk, Koyu veya Karanlık — hangi çıkarılan renklerin durak olacağını değiştirir, böylece tek bir fotoğraf birkaç çok farklı gradyan verebilir. Gradyan türünü (doğrusal, radyal veya konik), açıyı ve durakların kendilerini kontrol edersiniz: birini eklemek için çubuğa tıklayın, yeniden konumlandırmak için sürükleyin, tek tıkla ters çevirin veya döndürün.

Tüm süreç tarayıcınızda çalışır; görüntünüz asla bir sunucuya yüklenmez. Önizleme doğru göründüğünde, tam CSS kuralını, sadece background değerini veya çıkarılan renkleri kendi başlarına kopyalayın — fotoğraftan türetilmiş hero bölümleri, sayfa arka planları ve marka görselleri için idealdir.

Görüntüden Degrade Oluşturucu Nasıl Kullanılır

  1. Bir görüntüyü sürükleyip bırakın, göz atmak için tıklayın veya panonuzdan yapıştırın.
  2. Hangi çıkarılan renklerin durak olacağını seçmek için bir ruh hali seçin — Renkli, Parlak, Soluk, Koyu veya Karanlık.
  3. Gradyan türünü seçin (doğrusal, radyal veya konik) ve açıyı ayarlayın.
  4. Karışımı ince ayarlamak için renk duraklarını sürükleyin; gerektiğinde durakları ekleyin, kaldırın, ters çevirin veya yeniden karıştırın.
  5. Kopyala-yapıştıra hazır gradyan kodunu almak için "CSS'yi kopyala"ya tıklayın.

Sıkça sorulan sorular

Hayır. Görüntü doğrudan tarayıcınızdaki bir tuvale okunur ve renk çıkarma ile gradyan matematiğinin hepsi yerel olarak gerçekleşir. Hiçbir şey hiçbir noktada cihazınızdan ayrılmaz.

Evet, tamamen. Her şey istemci tarafında çalıştığı için kredi, hesap veya sınır yoktur — istediğiniz kadar görüntüden gradyan çıkarın.

Bu araç bir fotoğraftan başlar: görüntünün baskın renklerini çıkarır ve gradyanı bunlardan oluşturur. Normal Gradient Generator ise sıfırdan, kendinizin seçtiği renklerle başlar. İkisi de aynı türde düzenlenebilir, kopyalamaya hazır CSS üretir.

Ruh halleri, görüntünüzden çıkarılan renkleri yeniden sıralar: Renkli canlı, çeşitli tonları öne çıkarır, Parlak açık doygun tonları seçer, Soluk daha yumuşak matlaştırılmış olanları seçer, Koyu ve Karanlık ise daha zengin, daha koyu renkleri çeker. Ruh hali değiştirmek gradyan duraklarını anında yeniden oluşturur.

Evet. Her durak sürüklenebilir; durak eklemek veya seçilenleri kaldırmak için çubuğa tıklayabilir, herhangi bir durağın rengini değiştirebilir, doğrusal, radyal ve konik arasında geçiş yapabilir, açıyı 45°'lik adımlarla döndürebilir, yönü tersine çevirebilir veya görüntüden yeni renkleri yeniden karıştırabilirsiniz.
Paylaş
İlgili Araçlar
Degrade Oluşturucu 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. Ücretsiz
Görüntüden Renk Çıkarıcı Herhangi bir görüntüden rafine, kopyalamaya hazır renk paleti çıkarın. Ücretsiz
Renk Paleti Oluşturucu Etkileşimli renk tekerleğinden uyumlu renk paletleri oluşturun — analogous, complementary veya triad gibi uyum kuralları uygulayın, ardından herhangi bir değeri anında kopyalayın. Ücretsiz
Pantone Renk Eşleştirici Herhangi bir Pantone solid-coated kodunu arayarak HEX, RGB ve CMYK değerlerini okuyun veya bir HEX/RGB rengi girip en yakın Pantone eşleşmesini anında bulun — hepsi tarayıcınızda. Ücretsiz
Renk Tonları Oluşturucu Tek bir renkten ton ve gölgelerin tam aralığını oluşturun — koyulaştırma/açma adımınızı ve ton sayısını seçin, ardından herhangi bir değeri anında kopyalayın. Ücretsiz
Yazı Tipi Eşleştirme ve Google Fonts Dizini Popüler Google Fonts yazı tiplerinden oluşan özenle seçilmiş bir dizini canlı önizlemelerle inceleyin, kategoriye göre filtreleyin ve ada göre arayın, ardından yapıştırmaya hazır CSS'yi kopyalayın ve önerilen yazı tipi eşleşmelerini keşfedin — tümü tarayıcınızda. Ücretsiz
Popüler aramalar
görselden gradyan fotoğraftan gradyan çıkarma görselden css gradyan fotoğraf gradyan oluşturucu resimden gradyan oluştur fotoğraftan css gradyan
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.