Tek Renkten Renk Paleti Oluştur
Bir temel renkten tam bir palet oluşturun — tonlar, tamamlayıcı ve benzer renkler — ve her HEX kodunu kopyalayın.
HEX’i kopyalamak için herhangi bir örneğe tıklayın.
Yerelde üretilir
Duyurulmamış markalar için güvenli
Hesap yok
Güvenli bağlantı
Nasıl çalışır
- 1
Bir temel renk seçin
HEX kodunu yapıştırın — genellikle zaten bağlı olduğunuz marka rengi.
- 2
Uyum kuralını seçin
Kontrast için tamamlayıcı, sakinlik için komşu, çeşitlilik için üçlü ya da dörtlü, tek tonlu bir ölçek için tonlar.
- 3
Paleti kopyalayın
HEX değerlerini doğrudan stil dosyanıza, tema düzenleyicinize ya da tasarım aracınıza taşıyın.
Neden bu araç
Beş uyum kuralı
Tamamlayıcı, komşu, üçlü, dörtlü ve tonlar; her biri renk çemberinde tanımlı bir ilişki, bir ruh hâli değil.
Tek girdi, tam küme
Elinizdeki marka rengini verin; gerisi ondan türetilir, böylece palet monte edilmiş değil demirlenmiş olur.
Kopyalanabilir HEX değerleri
Her örnek kendi koduyla gelir; stil dosyasına ya da tasarım dosyasına hazırdır.
İlişkiyi görün
Üretilen renkler bir arada gösterilir; bir birleşimin tutup tutmadığına ancak böyle karar verilir.
Hiçbir şey yüklenmez
Çember aritmetiği tarayıcınızda çalışır — hiçbir renk değeri hiçbir yere gönderilmez.
Hesapsız ve ücretsiz
Kayıt yok, palet sınırı yok, filigran yok.
Uyum kuralı aslında nedir
Kurallar bir ton çemberi üzerindeki konumlardır, estetik görüşler değil. Temel rengin ton açısını alın; kural size diğerlerinin nerede durduğunu söyler: tamamlayıcı +180°’de, komşu kabaca ±30°’de, üçlü +120° ve +240°’de, dörtlü ise iki tamamlayıcı çift olarak. Mekanizmanın tamamı budur. Faydaları bu birleşimlerin nesnel olarak güzel olması değil — **öngörülebilir** olmasıdır. Kurala göre kurulmuş bir palet, üzerinde akıl yürütebileceğiniz biçimde başarısız olur; tek tek iyi görünen örnekleri toplayarak kurulmuş bir palet ise genelde kimsenin teşhis edemeyeceği biçimde başarısız olur, çünkü incelenecek bir ilişki yoktur.
Kurallar arasında seçim yapmak
Her kural farklı bir sorunu çözer. Komşu tonlar yan yana durur ve aile benzerliği taşır; bu onları güvenli ve sessiz kılar — bir arka plan ya da illüstrasyon için iyi, bir şeyin öne çıkması gerektiğinde zayıftır. Tamamlayıcı, ayrışmayı azamiye çıkarır; bir vurgunun ihtiyacı tam da budur: bir baskın renk ve tıklanmasını istediğiniz eylem için idareli kullanılan karşıt bir ton. Üçlü, dengede kalan üç ayrı ton verir, ama ancak biri açıkça baskınsa ve diğer ikisi ona destek olursa. Dörtlü dört ton sunar ve gerçekten zordur; pratikte işleyen dörtlü paletlerin çoğu, renklerden ikisini diğer ikisinin alanının küçük bir kesri kadar kullanır.
Bir arayüz neden tonlardan çok ton kademelerine ihtiyaç duyar
Yukarıdaki kurallar “hangi renkler bir arada durur” sorusunu yanıtlar; oysa gerçek bir ürünün ihtiyacı başkadır: aynı rengin çok sayıda kademesi. Bir sayfa arka planı, bir kart yüzeyi, saç teli inceliğinde bir kenarlık, devre dışı bir etiket ve gövde metni genelde aynı tonun farklı açıklık değerleridir; bu kademelerin eşit aralıklı olması, bitmiş görünüme üçlüyle dörtlü arasındaki seçimden daha çok etki eder. Tonlar modunun ürettiği şey budur — açıklık üzerinden adımlanmış tek bir ton, yani bir tasarım sistemi renk ölçeğinin kuruluş biçimi. Çoğu projenin ihtiyacı, beş ayrı tondan çok, bir vurgu tonu ve iyi kurulmuş bir nötr ölçektir.
Üretilen palet bir başlangıç noktasıdır, tasarım sistemi değil
Çemberin size verdiği şey ton ilişkileridir. Veremediği şey ise rollerdir. İşleyen bir palet her renge bir görev atar — bu yüzey, bu birincil eylem, bu yıkıcı eylem, bu kenarlık — ve bu atamalar geometriye değil sizin arayüzünüze bağlıdır. Çember okunabilirlik hakkında da hiçbir şey bilmez: üçlü bir şema kusursuz dengede olup yine de metni arka plan üzerine 2,5:1’de koyabilir. İlişkileri burada üretin, rolleri kendiniz atayın, sonra her metin-arka plan çiftini bir bileşen kütüphanesine girmeden önce kontrast denetleyicisinden geçirin.
60-30-10 oranı
Yaygın bir başarısızlık, beş renkli bir paleti beş rengi eşit kullanma izni sanmaktır; bu da kalabalık görünen ve odak noktası olmayan bir arayüz üretir. Gerçek düzenlerle temasta ayakta kalan gelenek kabaca %60 baskın bir nötr, %30 ikincil, %10 vurgudur. Bu oranda tamamlayıcı bir çift, rekabet hâlindeki iki renk değildir — geniş, sakin bir yüzey ve küçük, bilinçli bir kesintidir. Paletlerin makette üretimdekinden daha iyi görünmesinin sebebi de budur: maket örnekleri eşit boyutta gösterir, arayüz göstermeyecektir.
Bir paleti dönüştürmek ve genişletmek
Küme elinizde olduğunda asıl iş, onu bir stil dosyasının kullanabileceği hâle getirmektir. Çemberden gelen ton değerleri HEX olarak ulaşır; üzerine gelme, etkin ve devre dışı varyantları türetmeyi planlıyorsanız önce renk dönüştürücüyle HSL’ye çevirin ve açıklığı adımlayın; çünkü bu, her varyantı kayma olmadan aynı ton ailesinde tutar. Temel renkleri tek doğruluk kaynağı olarak saklayın ve varyantları onlardan üretin, birbirinin neredeyse aynısı düzinelerce hex kodu biriktirmek yerine — elle büyüyen bir palet birkaç ay içinde tutarsızlaşır.
Kaçınılması gereken yaygın hatalar
- Paletteki her rengi eşit ağırlıkta kullanmak. Eşit alanda beş renk, odak noktası olmayan bir arayüz üretir; vurgunun gerçekten vurgu olarak okunması için kabaca %60 baskın, %30 ikincil, %10 vurgu oranını koruyun.
- Neyin öne çıkması gerektiğini bilmeden şema seçmek. Komşu sakin ve vurguda zayıftır; tamamlayıcı, bir öğeyi kaçırılmaz kılmak için vardır. Kuralı örneklerin görünüşünden değil, işten seçin.
- Dengeli bir paleti okunaklı saymak. Renk çemberi kontrast oranları hakkında hiçbir şey bilmez — uyumlu bir çift, metni arka planına karşı yine 2,5:1’de bırakabilir.
- Bir arayüzü yalnızca tonlardan kurmak. Yüzeyler, kenarlıklar, devre dışı durumlar ve gövde metni çoğunlukla tek bir tonun farklı açıklıklarıdır; iyi bir ton ölçeği, günlük işte dördüncü bir vurgu renginden daha çok işe yarar.
- Üzerine gelme ve etkin varyantlarını yeni hex kodları olarak elle seçmek. Bunları temel renkten HSL’de açıklığı adımlayarak türetin, yoksa palet büyüdükçe aile tonu kayar.
Karşılaştırma
| KeroTools | Palet galerileri | Tasarım yazılımı | |
|---|---|---|---|
| Marka renginizden başlar | Evet | Genelde rastgele | Evet |
| Adlandırılmış uyum kuralları | Beş | Nadiren belirtilir | Var |
| Değerler sunucuya gider | Asla | Sıklıkla | Hayır |
| Hesap gerekir | Hayır | Kaydetmek için genelde | Lisans gerekir |
| Çevrimdışı çalışır | İlk yüklemeden sonra | Hayır | Evet |
| Maliyet | Ücretsiz | Ücretsiz / ücretli | Ücretli |
Özellikler
Tamamlayıcı
Tam karşıdaki ton, 180° uzakta — azami ayrışma; baskın bir rengin karşısında tek bir vurgu için kullanılır.
Komşu
Yaklaşık 30° aralıklı komşu tonlar; aile benzerliği taşır, sakin ve tutarlı okunur.
Üçlü
Eşit aralıklı 120°’lik üç ton — canlı ve dengeli, ama net bir baskın renk ister.
Dörtlü
İki tamamlayıcı çift hâlinde dört ton; en zengin şema ve dengelemesi en zor olanı.
Tonlar
Tek bir tonun açıklık üzerinden adımlanması — yüzeyler, kenarlıklar ve metin için arayüzlerin asıl ihtiyacı olan ölçek.
Her örnek için HEX
Üretilen her renk kendi kodunu taşır, kopyalamaya hazır.
Kurulum yok
İndirilecek ya da kurulacak bir şey yok — web sayfasında çalışır.
Arapça ve RTL uyumlu
Sekiz dilde tam arayüz, sağdan sola Arapça dahil.
Varsayılan olarak güvenli
HTTPS üzerinden sunulur, dosya takibi ve üçüncü taraf yüklemesi yoktur.
Kimler kullanıyor
Tasarımcılar
Mevcut bir marka renginden tutarlı bir küme türetmek, örnekleri gözle toplamak yerine.
Ön yüz geliştiricileri
Yüzeyler ve kenarlıklar için bir ton ölçeği elde etmek, bir düzine griyi elle seçmeden.
Küçük işletme sahipleri
Tek bir logo rengini bir sitede ve basılı malzemede kullanılabilir bir kümeye genişletmek.
Şablon temalayan herkes
Tema düzenleyicinin istediği ikincil ve vurgu alanlarını, ellerindeki tek renkten doldurmak.
Sıkça Sorulan Sorular
Hayır. Her şey tarayıcınızda yerel çalışır — hiçbir şey yüklenmez, saklanmaz veya paylaşılmaz.
Evet — tamamen ücretsiz, hesap ve sınır yok.