Renk paleti oluştur ve kontrastı denetle

Renk paleti ve kontrast denetleyici nasıl kullanılır

1. 1

   Bir renkle başlayın

   Bir ana renk yazın ya da seçin, ardından komşu renkler, üçlü veya bölünmüş tamamlayıcı gibi bir uyum seçin. İsterseniz rastgele bir palet de oluşturabilirsiniz.

2. 2

   Kilitleyin ve düzenleyin

   Beğendiğiniz renkleri yeniden karıştırmadan önce kilitleyin, herhangi bir rengi doğrudan düzenleyin ya da bir fotoğraftaki beş baskın rengi çıkarın.

3. 3

   Okunabilirliği kontrol edin

   Kontrast sekmesini açıp metni arka plana göre WCAG 2.2 AA ve AAA ölçütleriyle test edin, önerilen düzeltmeyi uygulayın ve paleti renk körlüğü açısından önizleyin.

4. 4

   Dışa aktarın

   50–950 tonlarıyla CSS değişkenlerini, Tailwind v4 temasını veya v3 yapılandırmasını, SCSS ya da JSON'u kopyalayın; isterseniz PNG renk örneğini indirin.

Renk paleti ve kontrast denetleyici hakkında

Renk paleti oluşturucu, beş renkli bir şema ve bir tasarım sisteminin çevresinde ihtiyaç duyduğu her şeyi üretir. Uyumlar, ana tonu HSL renk çemberinde döndürür: komşu renkler iki yanda 30° adım atar, tamamlayıcı karşıdaki tonu ekler, bölünmüş tamamlayıcı karşı tonun iki yanındaki tonları alır, üçlü birbirine 120° uzaklıkta üç ton yerleştirir, dörtlü 90° aralıklı bir kare kullanır, tek renkli ise tek tonu beş açıklık düzeyinde tutar. Rastgele modu kilitli renklere dokunmaz; resim seçeneği ise bir fotoğrafın piksellerini OKLab'de kümeleyerek birbirinden belirgin biçimde ayrılan en yaygın beş rengi bulur.

Tonlar sekmesi her renk için OKLCH'de 11 basamaklı bir 50–950 skalası üretir; renginize en yakın basamak tam değerin kendisidir. Dilerseniz Material 3 HCT sisteminin 13 tonunu ve bir Material temasının türeteceği beş anahtar paleti de alabilirsiniz. Kontrast denetleyicisi WCAG 2.2 parlaklık formülünü kullanır, oranı asla yukarı yuvarlamaz ve yalnızca açıklığı değiştirip tonu koruyarak geçen en yakın rengi önerir. Bir ızgara, paletteki her rengin beyaz ve siyaha göre oranını gösterir.

Benzetimler protanopi, deuteranopi, tritanopi ve akromatopsiyi Machado matrisleriyle kapsar ve birbirine karışan renkleri işaretler. Dışa aktarmalar renkleri tona göre adlandırır ve kendi adlarınızı kabul eder. Araç, renklerin bir markaya uyup uymadığını değerlendirmez; benzetimler de renk görme eksikliği olan kişilerin gördüğünü yaklaşık olarak gösterir, onlarla yapılacak testlerin yerini tutmaz.

Özellikler

Renk paleti ve kontrast denetleyici: sık sorulan sorular