Renk Paleti Oluşturucu
Bir ana renkten tamamlayıcı, komşu, üçlü ve tek renkli paletler üretin — renge tıklayınca hex kodu kopyalanır.
1.202 görüntülenme
Nasıl Çalışır
Renk teorisi, uyum kurallarını renk çemberi üzerindeki tonlar (hue) arasındaki sabit açısal ilişkiler olarak tanımlar. Bu araç bu hesabı RGB yerine HSL modelinde (Hue, Saturation, Lightness — Ton, Doygunluk, Açıklık) yapar; çünkü Hue, çember üzerinde doğal bir 0–360° değeridir — ilgili bir rengi bulmak için açıya bir sayı eklemek doğrudan aritmetiktir. RGB'de renkler yalnızca üç yoğunluk kanalıdır ve doğal bir "açı" kavramı yoktur; aynı uyum hesabını RGB üzerinden yapmak yine içeride HSL'ye dönüşüm gerektirir — bu araç doğrudan matematiğin doğal olduğu uzayda çalışır.
Ana renginizin Hue değerinden şunlar türetilir: tamamlayıcı (tam karşıdaki tek ton, taban + 180°, maksimum kontrast için), üçlü/triadik (çember üzerinde 120° aralıklarla eşit dağılmış üç ton, canlı ama dengeli), komşu/analog (±30°'lik komşu tonlar, birbirine yakın oldukları için sakin ve bütünlüklü görünür), ayrık tamamlayıcı (tamamlayıcıyı ±150°'den çevreleyen iki ton, saf tamamlayıcı çiftten daha az gerilimle kontrast sağlar) ve Hue ile Saturation'ı sabit tutup yalnızca Lightness'ı yukarı-aşağı kaydıran tek renkli ölçek. Örneğin 200°'lik bir mavi taban ton, 20°'lik turuncu bir tamamlayıcı ve 320° ile 80°'de üçlü tonlar üretir.
Bilinmesi Gerekenler
- Pratik 60-30-10 reçetesi: ana rengi tasarımın yaklaşık %60'ında, komşu bir tonu %30'unda, tamamlayıcıyı ise buton/bağlantı/vurgu gibi %10'luk aksanlarda kullanın.
- Uyum, erişilebilirlik değildir. İki tonun çember üzerinde matematiksel olarak ilişkili olması, açıklık kontrastları hakkında hiçbir şey söylemez; renk üzerine metin koyan kombinasyonları WCAG'a göre ayrıca doğrulayın.
- Herhangi bir renge tıklayın, hex kodu doğrudan panonuza kopyalanır.
- Doygunluk ve açıklık hâlâ büyük ölçüde önemlidir. İki palet aynı ton kümesini paylaşsa bile ruh hali tamamen farklı görünebilir — düşük doygunluklu, yüksek açıklıklı bir sürüm yumuşak ve pastel hissettirirken, aynı tonların tam doygunlukta ve düşük açıklıkta olanı cesur ve dramatik görünür.
- Kültürel çağrışımları unutmayın. Bir tonun matematiksel olarak "doğru" uyumu, o rengin farklı bölgelerde veya sektörlerde taşıdığı anlamı değiştirmez; örneğin kırmızı bazı bağlamlarda uyarı, bazılarında kutlama çağrıştırabilir.
Hızlı bir örnek: taban renk olarak #3B82F6 (orta mavi, yaklaşık 217° hue) seçin. Tamamlayıcı yaklaşık 37°'de, sıcak bir turuncuda oturur — mavi ağırlıklı bir arayüzde birincil buton için doğal bir eşleşmedir. Üçlü küme ise yaklaşık 97° (sarı-yeşil) ve 337° (macenta-pembe) tonlarını ekler; bir tasarımın kategori etiketleri veya bir grafiğin veri serileri gibi üç farklı ama dengeli vurgu rengine ihtiyaç duyduğu durumlarda kullanışlıdır. Aynı taban rengin tek renkli ölçeği ise sadece açıklığı adım adım değiştirerek, bir arayüzün hover, aktif ve devre dışı durumları gibi ince tonal farklar gerektiren yerlerde işe yarar.
Sıkça Sorulan Sorular
Hangi uyumu seçmeliyim?
Komşu (analog) paletler, tonlar çember üzerinde birbirine yakın durduğu için sakin ve bütünlüklü görünür; tamamlayıcı, buton gibi vurgular için en yüksek kontrastı verir; üçlü canlı ama dengelidir. Arayüzlerde en güvenlisi tek renkli ölçektir — tek ton, birkaç açıklık basamağı; birden fazla tonu kendiniz harmanlama konusunda kendinize güvenmiyorsanız bile her zaman bütünlük hissi verir.
Ton neden doğrudan RGB yerine HSL üzerinden hesaplanıyor?
HSL, Hue'yu çember üzerinde tek bir açı (0–360°) olarak temsil eder; bu yüzden "tamamlayıcı için 180° döndür" tek adımlık bir toplama işlemidir. RGB'nin doğal bir açı kavramı yoktur — kırmızı, yeşil, mavi kanalları bir çembere temiz biçimde oturmaz; bu nedenle uyumu doğrudan RGB üzerinden hesaplamak aynı sonuç için çok daha karmaşık matematik gerektirirdi ve içeride yine de HSL'ye dönüşüm yapmayı gerektirirdi. Bu yüzden neredeyse tüm renk araçları uyum hesaplarını HSL veya benzeri bir silindirik model üzerinde yapar, sonucu görüntülemeden hemen önce RGB'ye geri çevirir.
Tamamlayıcı ile ayrık tamamlayıcı arasındaki fark nedir?
Tamamlayıcı, tam olarak 180° uzaktaki tek tonu kullanır — maksimum kontrast sağlar ama eşit miktarda kullanıldığında görsel olarak gergin hissettirebilir. Ayrık tamamlayıcı, o noktanın iki yanındaki tonları kullanır (tabandan ±150°); güçlü kontrastı korurken biraz daha yumuşak ve dengelenmesi daha kolay hisseder — bu yüzden birçok logo ve marka paleti saf tamamlayıcı çift yerine buna dayanır.
Rengi nasıl kopyalarım?
Renk karesine tıklayın — hex kodu anında panonuza kopyalanır ve bir onay görünür; doğrudan CSS'e, bir tasarım aracına veya koda yapıştırmaya hazırdır. Farklı bir başlangıç noktası denemek isterseniz taban rengi değiştirip tüm paletin nasıl yeniden hesaplandığını canlı olarak görebilirsiniz.
Üretilen paletler metin için erişilebilir mi?
Otomatik olarak değil. Uyum, ton ilişkilerini tanımlar, açıklık kontrastını değil — iki uyumlu renk, biri metin biri zemin olduğunda, özellikle benzer açıklıktaki iki orta tonda, yine de okunabilirlikte başarısız olabilir. Renk üzerine metin koyacaksanız yayınlamadan önce özel bir kontrast denetleyicisiyle en az 4,5:1 (büyük metin için 3:1) WCAG oranını doğrulayın; bu araç uyumu sağlar ama kontrast garantisi vermez.
Benzer Araçlar
Sorun Bildir
Renk Paleti Oluşturucu
Yorumlar
Henüz yorum yok — ilk yorumu siz yazın!