#8C8C8C renk kodu içgörüleri

Güvenle tasarım yapmanız için ihtiyacınız olan tüm dönüşümler, uyumlar ve erişilebilirlik kontrolleri.

RGB:rgb(140, 140, 140)
HSL:hsl(0, 0%, 55%)
HEX
#8C8C8C
RGB
140, 140, 140
HSL
0°, 0%, 55%
HSV
0°, 0%, 55%
CMYK
0%, 0%, 0%, 45%

Renk Dönüşümü

Birden fazla renk modelindeki değerleri tek bir yerde oluşturun.

#8C8C8C

≈ Çelik Mavi

Referans renk kartları

Daha düşük ΔE, daha yakın görsel eşleşme anlamına gelir

Tonlar ve gölgeler

#8C8C8C renginin beyaz veya siyahla karıştırıldığında nasıl davrandığını keşfedin. Bu renk örnekleri, üzerine gelme durumları (hover), gölgeler ve arka planlar için mükemmeldir.

Herhangi bir hex değerini kopyalamak ve arayüzünüzde yeniden kullanmak için üzerine gelin.

Gölgeler

0–100%
0%#8C8C8C
10%#7E7E7E
20%#707070
30%#626262
40%#545454
50%#464646
60%#383838
70%#2A2A2A
80%#1C1C1C
90%#0E0E0E
100%#000000

Tonlar

0–100%
0%#8C8C8C
10%#989898
20%#A3A3A3
30%#AFAFAF
40%#BABABA
50%#C6C6C6
60%#D1D1D1
70%#DDDDDD
80%#E8E8E8
90%#F4F4F4
100%#FFFFFF

Yaygın kullanım durumları

  • Kullanıcı arayüzü bileşen durumları (üzerine gelme, aktif, devre dışı)
  • Gölgeler ve vurgularla derinlik oluşturma
  • Tutarlı renk sistemleri oluşturma

Tasarım sistemi

Tasarım sistemi ipucu

Bu varyasyonlar, uyumlu bir paletin temelini oluşturur. Pazarlama, ürün ve mühendisliği uyumlu tutmak için bunları dışa aktarın.

Paleti dışa aktar

Renk uyumları

#8C8C8C renginden oluşturulan uyumlarla anında dengeli paletler oluşturun.

Kendi detay sayfasını açmak ve keşfetmeye devam etmek için herhangi bir renk örneğine tıklayın.

Nasıl kullanılır

Bir baskın renk seçin, ardından destekleyici tonların tipografi, yüzeyler ve harekete geçirici düğmeler için vurgu görevi görmesine izin verin.

Neden önemlidir

Dengeli uyumlar, düzeninizi boğmadan niyeti (sakin, enerjik, premium) iletir.

Tamamlayıcı

Etki ve cesur kontrast yaratan zıt tonlar.

En iyisi

Yüksek etkili Harekete Geçirici Mesajlar (CTA), logolar ve kahraman bölümleri

Benzer

Doğal, akıcı gradyanlar için komşu tonlar.

En iyisi

Doğadan ilham alan, sakinleştirici kontrol panelleri

Üçlü

Oyunbaz denge için eşit aralıklı üç ton.

En iyisi

Oyunbaz markalama ve editoryal düzenler

Dörtlü

Zengin çeşitlilik sunan iki tamamlayıcı çift.

En iyisi

İllüstrasyonlar ve pazarlama deneyleri

Tek renkli

Aynı ton ailesi içindeki daha açık ve daha koyu kardeşler.

En iyisi

Minimalist arayüzler ve premium kullanıcı arayüzü durumları

Erişilebilirlik kontrastı

Her ziyaretçinin net bir deneyim yaşamasını sağlamak için #8C8C8C renginin yaygın metin renkleriyle ne kadar okunabilir olduğunu kontrol edin.

Gövde metni için AA'yı temel, premium erişilebilirlik için ise AAA'yı kullanın.

siyah metin üzerinde örnek metin
Metin rengi#000000
Arka plan#8C8C8C
Kontrast oranı6.25:1
WCAG seviyesiAA
beyaz metin üzerinde örnek metin
Metin rengi#FFFFFF
Arka plan#8C8C8C
Kontrast oranı3.36:1
WCAG seviyesiFail
Önerilen metin önizlemesi
Metin rengi#000000
Arka plan#8C8C8C
Kontrast oranı6.25:1
WCAG seviyesiAA

Teknik Formatlar

XYZ, LAB, CMYK varyantları gibi profesyonel renk uzaylarının ve dışa aktarmaya hazır profillerin kilidini açın.

Ücretsiz kaydolun

Pratik Formatlar

Baskı simülasyonları, LED eşlemeleri ve geliştiriciye hazır bayt sıralamaları edinin.

Ücretsiz kaydolun

Renk Analizi

Spektral verilere, baskınlık raporlarına ve gelişmiş analitiklere dalın.

Ücretsiz kaydolun

Renk Körlüğü Simülatörü

#8C8C8C renginin yaygın renk görme eksikliklerinde nasıl göründüğünü önizleyin.

Ücretsiz kaydolun

Yaratıcı Yönler

Mevsimsel çağrışımları, duygusal ipuçlarını ve doğal oluşumları keşfedin.

Ücretsiz kaydolun

Tasarım rehberliği

Denge

#8C8C8C rengini bir vurgu olarak ele alın. Görsel aşırı yüklenmeyi önlemek için nötr renkler ve bir destekleyici tonla eşleştirin.

Kontrast

Kombinasyonları gerçek içerikle test edin. Daha yüksek kontrast, taramayı, okunabilirliği ve dönüşümleri iyileştirir.

Uyum

Yüzeyler için daha açık tonları, birincil renkler için ana rengi ve üzerine gelme veya basılı durumlar için daha koyu gölgeleri kullanın.

Başka bir renge mi ihtiyacınız var?

Görüntü yüklemek, paletler oluşturmak ve yeni renk ilişkilerini keşfetmek için renk seçiciye geri dönün.

Renk seçiciyi aç