ya da
Görsel sürükle ya da tıkla
Ton skalası (50 → 900) — arayüz tasarımının belkemiği
Analog — komşu renkler, huzurlu ve uyumlu
Tamamlayıcı — karşıt renk, vurgu ve buton için
Bölünmüş tamamlayıcı — kontrast var ama daha yumuşak
Üçlü uyum — canlı ve dengeli üçlü
Dörtlü uyum — zengin ama dikkatli kullan
Hazır arayüz seti — bu renkle çalışan tam bir tema
Paleti dışa aktar — CSS, Tailwind, SCSS, JSON
Her renge tıklayınca HEX kodu panoya kopyalanır. Rozetler o rengin üzerine beyaz (B) ve siyah (S) yazının okunup okunmadığını gösterir — WCAG AA eşiğine göre.
Paleti doğru kullanmak
- 60-30-10 kuralı: %60 nötr zemin, %30 ikincil renk, %10 vurgu. Ana rengi her yere sürersen hiçbir yer öne çıkmaz.
- Ton skalasını kullan: profesyonel arayüzler tek bir renk değil, o rengin 8-10 tonuyla kurulur. 50-100 zemin, 500-600 buton, 800-900 yazı.
- Rozetlere bak: butonun rengi güzel olabilir ama üzerindeki yazı okunmuyorsa müşteri kaybedersin.
- Kırmızı-yeşil ikilisine dikkat: erkeklerin yaklaşık %8'i bu ikiliyi ayırt edemez; "hata/başarı" durumlarını sadece renkle anlatma, ikon veya yazı da ekle.