Önce örnek paleti ayıklayın, ardından kendi projenizde hangi renklerin yer alacağına karar vermek için hassas seçim ve manuel düzenlemeler yapın. Görsel Renk Seçici aç.
Yükleyin ve bir başlangıç paleti çıkarın
Görüntü Renk Seçici'yi açın ve desteklenen bir görüntü yükleyin veya örneği deneyin. Otomatik çıkarma, kaynağı sunucuya yükler. Bu kılavuzdaki örnek collage-botanical.jpg, çiçeklerin, yaprakların ve şeftali rengi bir arka planın 1200 x 900 fotoğrafıdır.
Çıkarılacak Renkler'i 6 değerinde bırakın ve örnek için Baskın'ı seçin. Baskın, ana görüntü renklerini tercih ederken, Canlı renkli vurgulara daha fazla etki sağlar. Bir istek 3 ile 12 arasında renk kullanabilir; daha az belirgin görünür gruba sahip bir görüntü daha az renk döndürebilir.
Gerçek Baskın sonuç #E3B49F, #A5927F, #F3C2AC, #FBCEBA, #746E4F, #C297CA içerir. En büyük grup, örneklenen görünür piksellerin yaklaşık %28.88'u ile #E3B49F'dir. Çıkarma işlemi 512 x 384 bir örnek kullandı; bu yüzdeler tam çözünürlüklü görüntünün kesin bir sayımı değildir.
Bir palet rengi, yakındaki renklerin ortalaması olabilir. Küçük bir detayın değerine ihtiyaç duyduğunuzda belirli bir pikseli seçin.
Bireysel renkleri seçin ve iyileştirin
Büyüteçle bir pikseli incelemek için görüntüye tıklayın veya dokunun. Görüntüye odaklanın ve bir piksel hareket etmek için ok tuşlarını, on piksel hareket etmek için Shift artı ok tuşunu kullanın, ardından seçmek için Enter'a basın. HEX, RGB veya HSL değerlerini kendi kopyalama düğmesiyle kopyalayın veya Palete ekle'yi kullanın.
Bir renk örneğinin HEX değerini veya rengini değiştirmek, sola veya sağa taşımak ya da kaldırmak için bir örnek seçin. Özel renk ekle, seçtiğiniz bir HEX değerini kabul eder. Rengi kilitle, Paleti yenile veya değiştirilmiş bir ayıklama ayarı başka bir başlangıç paleti oluşturduğunda seçili renk örneğini korur.
Örnekleme ve şeffaflık, Kaynak renk ve Arka plan üzerinde birleştirme seçenekleri sunar. Kaynak renk, ilgili olduğunda kopyalanan kodlara opaklığı dahil eder; Birleştirme, pikselin seçilen Örnek arka plan üzerinde harmanlanmış halini gösterir. Palet örneklerinin kendileri opak RGB değerleridir. Düzenlenen ve seçilen renklerin tahmini kaynak yüzdesi yoktur.
Tarayıcı tarafından çözülebilen görseller, tarayıcı sRGB örneklerini kullanır. Normalleştirilmiş bir önizleme kullanılıyorsa, renk seçici renklerini ve koordinatlarını açıkça yaklaşık olarak etiketler.
Bu kılavuzdaki örnek
Ayıklanacak renkler: 6; Baskın; manuel değişiklik veya kilit yok; Farklı kaydet: PNG. Otomatik ayıklama 512 x 384 piksel örnekledi.
- Kaynak görsel
- 1200 x 900 px
- Ayıklanan renkler
- 6 opak renk
- Palet kartı
- 600 x 500 px
- İndirilen PNG
- 9,163 bayt
Bir metin ve arka plan çiftini kontrol edin
Renk kontrastını kontrol et'i açın. Renk kontrolleriyle Metin ve Arka planı ayarlayın, HEX kodlarını girin veya her iki taraf için de seçilen rengi kullanın. Canlı metin örneği, çifti karşılaştırmanıza olanak tanır ve oran; Normal AA, Normal AAA, Büyük AA ve Büyük AAA sonuçlarıyla birlikte sunulur.
Ayıklanan her rengin metin olarak kullanılabileceğini varsaymak yerine, amaçlanan kullanım için bir çift seçin. Açık şeftali ve açık mor bir fotoğrafta birlikte çalışabilir, ancak zayıf bir metin ve arka plan kombinasyonu oluşturabilir.
Bu kontrol yalnızca metin kontrastı için o renk çiftini denetler. Tam bir erişilebilirlik denetimi değildir ve tipografinin, klavye etkileşiminin veya tasarımın geri kalanının kullanılabilir olup olmadığına karar vermez.
Geçerli bir kontrast oranı yararlı bir kontroldür, ancak sayfanın tamamının erişilebilir olduğunun garantisi değildir.
Değerleri kopyalayın veya paleti dışa aktarın
Hızlı bir teslimat için, bireysel bir kod kopyalayın veya Palet HEX renklerini kopyala seçeneğini kullanın. Bir dosya için, Farklı kaydet'i seçin ve Başlat'a tıklayın. PNG etiketli bir palet görseli oluşturur; SVG örnekleri ve etiketleri vektör içeriği olarak tutar; CSS numaralandırılmış renk değişkenleri sağlar; JSON ise HEX, RGB ve HSL değerlerini içerir.
Düzenlenmemiş altı renkli örnek, palette.png formatında 600 x 500 piksel ve 9,163 bayt olarak dışa aktarılır. Örnek sırası paletle eşleşir. Otomatik başlangıç sayısı farklı olsa bile, düzenlemeden sonra nihai paletiniz 1 ila 12 renk içerebilir.
Ayrılmadan veya yenilemeden önce indirin. Nihai dışa aktarma, sunucu işleme için kaynak ve seçilen renkleri yükler. Yeni bir palet dosyası oluşturur ve orijinal fotoğrafı yeniden renklendirmez veya değiştirmez.
PNG ve SVG kullanışlı görsel referanslardır. CSS ve JSON, bir sonraki adımda yeniden kullanılabilir renk değerlerine ihtiyaç duyulduğunda yararlıdır.
Sıkça sorulan sorular
Damlalık, otomatik ayıklama ile aynı renkleri mi döndürür?
Her zaman değil. Seçilen bir değer, belirli bir kaynak veya önizleme pikselini tanımlar. Otomatik ayıklama, örneklenen pikselleri gruplandırır ve ortalama renkler döndürebilir.
Şeffaf pikseller sayılıyor mu?
Tamamen şeffaf pikseller ayıklama işlemine dahil edilmez. Kısmen şeffaf pikseller daha düşük ağırlığa sahiptir. Kaynak örnekleme opaklığı gösterebilir, ancak dışa aktarılan palet örnekleri opaktır.
Yenilediğimde kilitli renklere ne olur?
Kilitli renkler palette kalırken, yeni ayıklanan renkler diğer konumları doldurur. Korunan veya düzenlenen bir renge uydurma bir görsel yüzdesi atanmaz.
Bunu tam bir marka rengi için kullanabilir miyim?
Bilinen bir HEX değerini doğrudan girin veya uygun bir kaynak pikseli seçin. Fotoğraf aydınlatması, sıkıştırma, renk yönetimi ve normalleştirilmiş önizlemeler örneklenen değerleri değiştirebilir, bu nedenle otomatik bir fotoğraf paleti orijinal marka spesifikasyonunun kanıtı değildir.
Bir sonraki tasarımınıza taşıyabileceğiniz bir palet oluşturun
Bir örnek deneyin veya kendi dosyanızı kullanın ve paylaşmadan önce sonucu inceleyin.
