Palet ile damlalık arasındaki fark nedir?

Palet tüm resimdeki en baskın 6 rengi gösterir — bir fotoğraftan bir tasarım sistemi çıkarmak için iyi. Damlalık tam bir piksel seçmenize izin verir — belirli bir tonu eşleştirmek, bir hex değerini doğrulamak veya tek bir öğeyi örneklemek için iyi.

Büyük resimler neden küçültülüyor?

12MP'lik bir fotoğrafta piksel analizi 12 milyon piksel okumayı gerektirir — yavaş ve bellek ağır. Uzun kenarda 1.600px'e küçültmek bunu ~1,5 milyon piksele indirir ve palet çıkarma için görünür doğruluk kaybı olmaz. Damlalık hala küçültülmüş tampondan okur, bu nedenle piksel koordinatları buna atıfta bulunur.

CSS dışa aktarmanın formatı nedir?

Çıktı, herhangi bir stil sayfasına yapıştırmaya hazır, numaralı özel özelliklere sahip bir :root bloğudur. Örnek: `:root { --color-1: #FF5733; /* turuncu */ --color-2: #C70039; /* koyu kırmızı */ ... }`. Her özellik, otomatik algılanan renk adını yorum olarak içerir.

Renk adları doğru mu?

Adlar bir HSL ton kovası sezgisinden gelir (kırmızı, turuncu, sarı, yeşil, camgöbeği, mavi, mor, pembe, artı açık/koyu varyantlar). Bunlar yaklaşımlardır, adlandırılmış renk veritabanlarıyla eşleşmeler değildir. 'Mercan' veya 'turkuaz' gibi 'adlandırılmış' bir renk için bunun yerine en yakın kova adını bekleyin.

Araç şeffaf resimleri destekliyor mu?

Evet. Tamamen şeffaf pikseller palet çıkarma sırasında atlanır. Yarı şeffaf pikseller örneklemeden önce beyazla karıştırılır — bu, rengin tipik bir beyaz arka planda görüntülendiğinde nasıl göründüğünü yansıtır.

Resmim bir yere yükleniyor mu?

Hayır. Her şey anında gerçekleşir. Resminiz belleğe çözülür, analiz edilir ve atılır — hiçbir şey cihazınızdan çıkmaz.

Mobilde renk seçebilir miyim?

Evet. Damlalık dokunmatik ile çalışır — merceği hareket ettirmek için dokunun ve sürükleyin, o noktadaki rengi onaylamak için parmağınızı kaldırın. Küçük ekranlarda hassas piksel hedefleme için tarayıcıyı yakınlaştırın veya daha büyük bir kaynak resim kullanın.

Ad Slot — Header Banner

Damlalık + Otomatik Palet · %100 Gizli

Resim Renk Paleti ve HEX Çıkarıcı

Herhangi bir fotoğraf yükleyin, baskın renk paletini çıkarın ve interaktif bir damlalıkla hassas HEX, RGB veya HSL değerleri seçin. Tek kodları kopyalayın veya tüm paleti CSS değişkenleri olarak indirin. Her şey anında gerçekleşir — yükleme yok.

#HEX#RGB#HSL#Palet#CSS#Damlalık

Bir resim bırakın veya göz atmak için tıklayın

PNG, JPG, WebP, AVIF, GIF · Tek dosya · Anında analiz edilir

Paletini çıkarmak için bir resim yükleyin

PNG, JPG, WebP, AVIF veya GIF. Damlalık piksel düzeyinde hassasiyet verir; palet en baskın 6 rengi gösterir.

Ad Slot — Below the Fold

Bir resimden renkleri 3 adımda nasıl çıkarırsınız

Baskın palet + piksel düzeyinde damlalık.

Resminizi yükleyin

Bir PNG, JPG, WebP, AVIF veya GIF bırakın. Araç hız için dahili olarak küçültür, sonra en baskın 6 rengi bulmak için bir medyan kesim nicelleyicisi çalıştırır.

Belirli pikselleri seçin

Büyüteç merceğini etkinleştirmek için resmin üzerine gelin. Tek tek pikselleri hedefleyebilmeniz için 12× yakınlaştırır. Seçilen renk kartında o rengi kilitlemek için herhangi bir noktaya tıklayın.

Kodları kopyalayın veya CSS dışa aktarın

Her örnek HEX, RGB ve HSL gösterir — kopyalamak için herhangi bir satıra tıklayın. Bir stil sayfasına yapıştırmak için :root değişkenlerini almak üzere CSS Kopyala düğmesini veya bir .css dosyası için CSS İndir'i kullanın.

Sıkça Sorulan Sorular

Medyan kesim nicelleme kullanır — renk uzayını en uzun ekseni boyunca medyanda tekrar tekrar bölen ve ardından ortaya çıkan her bölgeyi ortalayan klasik bir algoritma. Bu, resmin gerçek renk dağılımını naif histogram örneklemesinden daha iyi yansıtan bir palet üretir.

Resim Renk Paleti ve HEX Çıkarıcı Hakkında

Everything you need to know

Neden resimlerden palet çıkarmalı?

Tasarımcılar, geliştiriciler ve pazarlamacılar sıklıkla bir marka varlığından, bir fotoğraftan veya bir rakibin arayüzünden renkleri eşleştirmeye ihtiyaç duyar. Manuel renk seçimi sıkıcı ve hataya açıktır. Bu araç baskın renklerin keşfini otomatikleştirir ve hassas iş için piksel düzeyinde örnekleme sağlar — hepsi tek bir arayüzde. Bir moodboard'dan bir tasarım sistemi oluşturmak, bir logodan marka renklerini çıkarmak veya bir manzara fotoğrafından tutarlı bir palet çekmek için kullanın.

Renk formatlarını anlama

HEX web ve tasarım araçları için standarttır — kırmızı, yeşil ve maviyi temsil eden altı onaltılık basamak (örn. #FF5733). RGB aynı değerleri ondalık üçlüler olarak ifade eder (255, 87, 51) — programatik kullanım için daha iyi. HSL ton, doygunluk ve açıklığı insan tarafından okunabilir terimlerle tanımlar (11°, %100, %60) — 'yüzde 20 daha koyu' veya 'daha doygun' gibi varyasyonlar oluşturmak için daha iyi. Her örnek üçünü de gösterir ve herhangi bir satır kopyalamak için bir tıklamadır.

Medyan kesim nicelleme açıklandı

Medyan kesim, 1980'den kalma, milyonlarca rengi küçük bir temsili sete indiren klasik bir algoritmadır. Renk uzayını en uzun boyutu boyunca tekrar tekrar bölerek, pikselleri medyan değerde ayırarak çalışır. N bölmeden sonra N bölgeniz olur; her bölgenin ortalaması bir palet rengi olur. Bu, algısal olarak dengeli paletler üretir — yerel minimumlarda sıkışıp kalabilen naif k-means'tan veya görsel olarak benzer kümeleri tercih eden histogram yaklaşımlarından farklı olarak.

Gizlilik, performans ve tarayıcı desteği

Her şey cihazınızda çalışır — resminiz tarayıcınızdan asla çıkmaz. Tipik bir 4MP fotoğrafta palet çıkarma 100–300ms sürer. Damlalık, algılanabilir gecikme olmadan doğrudan bellek içi piksel tamponundan okur. Araç her modern tarayıcıda (Chrome, Firefox, Safari, Edge) çalışır ve ilk yüklemeden sonra çevrimdışı işlevsel kalır.