Rəng Kodu Generator və Seçici

Rəng kodları, varyasyonlar, harmoniyalar yaradın və kontrast nisbətlərini yoxlayın.

Rəng çevrilməsi

HEX

#ca4e4e

Chestnut Rose

HEX
#ca4e4e
HSL
0, 54, 55
RGB
202, 78, 78
XYZ
28, 19, 9
CMYK
0, 61, 61, 21
LUV
50,105,21,
LAB
50, 49, 26
HWB
0, 31, 21

Varyasyonlar

Bu bölmənin məqsədi seçdiyiniz rəngin 10% artımla çalarlarını (təmiz ağ əlavə) və kölgələri (saf qara əlavə etmək) dəqiq şəkildə yaratmaqdır.

Pro İpucu: Hover vəziyyətləri və kölgələr üçün kölgələrdən, vurğulamalar və fonlar üçün rənglərdən istifadə edin.

Kölgələr

Əsas rənginizə qara əlavə etməklə daha tünd variasiyalar yaradılmışdır.

Rənglər

Əsas rənginizə ağ əlavə etməklə daha açıq variasiyalar yaradılmışdır.

Ümumi istifadə halları

  • UI komponenti vəziyyətləri (over, aktiv, qeyri-aktiv)
  • Kölgələr və işıqlandırmalarla dərinliyin yaradılması
  • Ardıcıl rəng sistemlərinin qurulması

Dizayn Sistemi İpucu

Bu varyasyonlar vahid rəng palitrasının əsasını təşkil edir. Bütün layihənizdə ardıcıllığı qorumaq üçün onları ixrac edin.

Rəng Kombinasiyaları

Hər bir harmoniyanın öz əhval-ruhiyyəsi var. Birlikdə yaxşı işləyən rəng kombinasiyalarını beyin fırtınası etmək üçün harmoniyalardan istifadə edin.

Necə istifadə etməli

Hex dəyərini kopyalamaq üçün istənilən rəngə klikləyin. Bu birləşmələrin vizual harmoniya yaratdığı riyazi olaraq sübut edilmişdir.

Niyə vacibdir

Rəng harmoniyaları tarazlıq yaradır və dizaynlarınızda xüsusi emosiyalar oyadır.

tamamlayıcı

Rəng çarxında rəng və onun əksi, +180 dərəcə çalar. Yüksək kontrast.

#ca4e4e
Üçün ən yaxşısı: Yüksək təsirli dizaynlar, CTA-lar, loqolar

Split-tamamlayıcı

Bir rəng və onun tamamlayıcısına bitişik iki, əsas rəngin əksinə olan dəyərdən +/-30 dərəcə çalar. Düz bir tamamlayıcı kimi qalın, lakin daha çox yönlüdür.

Üçün ən yaxşısı: Canlı, lakin balanslaşdırılmış planlar

triadik

Rəng çarxı boyunca hər biri bir-birindən 120 dərəcə çalarlarla bərabər şəkildə yerləşdirilmiş üç rəng. Bir rəngin üstünlük təşkil etməsinə icazə vermək və digərlərini vurğu kimi istifadə etmək yaxşıdır.

Üçün ən yaxşısı: Oynaq, enerjili dizaynlar

Analoq

Rəng çarxında bitişik olan çalarlarla eyni parlaqlıq və doyma üç rəng, 30 dərəcə bir-birindən. Hamar keçidlər.

Üçün ən yaxşısı: Təbiətdən ilhamlanmış, sakitləşdirici interfeyslər

Monoxromatik

Parlaqlıq dəyərləri +/-50% olan eyni çalarlı üç rəng. Zərif və zərif.

Üçün ən yaxşısı: Minimalist, mürəkkəb dizaynlar

tetradik

60 dərəcə çalarlarla ayrılmış iki tamamlayıcı rəng dəsti.

Üçün ən yaxşısı: Zəngin, müxtəlif rəng sxemləri

Rəng nəzəriyyəsinin prinsipləri

Balans

Bir dominant rəngdən istifadə edin, ikinci dərəcəli ilə dəstəkləyin və diqqətli şəkildə vurğulayın.

Kontrast

Oxunma və əlçatanlıq üçün kifayət qədər kontrastı təmin edin.

Harmoniya

Rənglər vahid vizual təcrübə yaratmaq üçün birlikdə işləməlidir.

Rəng Kontrast Yoxlayıcısı

Mətnin oxunması üçün WCAG əlçatanlıq standartlarına cavab verməsini təmin etmək üçün rəng birləşmələrini sınaqdan keçirin.

Mətn Rəngi
Fon rəngi
Kontrast
Fail
Kiçik mətn
✖︎
Böyük mətn
✖︎
WCAG Standartları
AA:Normal mətn üçün 4.5:1 və böyük mətn üçün 3:1 minimum kontrast nisbəti. Əksər saytlar üçün tələb olunur.
AAA:Normal mətn üçün 7:1 və böyük mətn üçün 4.5:1 təkmilləşdirilmiş kontrast nisbəti. Optimal əlçatanlıq üçün tövsiyə olunur.

Hamı Dahidir. Ancaq bir balığı ağaca dırmaşmaq qabiliyyətinə görə mühakimə etsəniz, o, bütün ömrünü onun axmaq olduğuna inanaraq yaşayar.

- Albert Einstein

Texniki formatlar

Praktik formatlar

Rəng təhlili

Korluq simulyatoru

Yaradıcı Aspektlər