Színkonverzió
#ff69b4
Variációk
Ennek a szekciónak a célja, hogy pontosan előállítsa a kiválasztott szín árnyalatait (tiszta fehér hozzáadásával) és tónusait (tiszta fekete hozzáadásával) 10%-os lépésekben.
Profi tipp: Használj árnyalatokat hover állapotokhoz és árnyékokhoz, tónusokat kiemelésekhez és háttérhez.
Árnyalatok
Sötétebb variációk, amelyeket fekete hozzáadásával hozunk létre az alapszínedhez.
Tónusok
Világosabb variációk, amelyeket fehér hozzáadásával hozunk létre az alapszínedhez.
Gyakori felhasználási esetek
- • UI komponens állapotok (hover, aktív, letiltott)
- • Mélység létrehozása árnyékokkal és kiemelésekkel
- • Konzisztens színrendszerek építése
Design rendszer tipp
Ezek a variációk képezik az összefüggő színpaletta alapját. Exportáld őket, hogy fenntartsd a konzisztenciát az egész projektedben.
Színkombinációk
Minden harmóniának megvan a maga hangulata. Használj harmóniákat, hogy ötletelj olyan színkombinációkon, amelyek jól működnek együtt.
Hogyan használd
Kattints bármelyik színre, hogy lemásold a hex értékét. Ezek a kombinációk matematikailag bizonyítottan vizuális harmóniát hoznak létre.
Miért fontos
A színharmóniák egyensúlyt teremtenek és specifikus érzelmeket váltanak ki a dizájnjaidban.
Komplementer
Egy szín és az ellentéte a színkörön, +180 fokos árnyalat. Nagy kontraszt.
Megosztott komplementer
Egy szín és két szomszédos a komplementeréhez, +/-30 fokos árnyalat az ellentétes értéktől. Merész, mint az egyenes komplementer, de sokoldalúbb.
Triádikus
Három szín egyenletesen elosztva a színkörön, mindegyik 120 fokos árnyalat távolságra. Legjobb, ha egy szín dominál, a többit hangsúlyként használjuk.
Analóg
Három azonos fényerősségű és telítettségű szín, amelyek a színkörön egymás mellett helyezkednek el, 30 fok távolságra. Sima átmenetek.
Monokróm
Három azonos árnyalatú szín, fényerősség értékek +/-50%. Finom és kifinomult.
Tetrádikus
Két pár komplementer szín, amelyeket 60 fokos árnyalat választ el.
Színtan elvek
Egyensúly
Használj egy domináns színt, támogasd másodlagossal, és hangsúlyozz ritkán.
Kontraszt
Biztosíts elegendő kontrasztot az olvashatóság és hozzáférhetőség érdekében.
Harmónia
A színeknek együtt kell működniük, hogy egységes vizuális élményt nyújtsanak.
Színkontraszt ellenőrző
Teszteld a színkombinációkat, hogy megfeleljenek a WCAG hozzáférhetőségi szabványainak a szöveg olvashatósága érdekében.
Szöveg színe
Háttér színe
Kontraszt
WCAG szabványok
Fejlett kontraszt ellenőrző
Finomhangolás csúszkákkal, több előnézettel és még több lehetőséggel
Mindenki zseni. De ha egy halat az alapján ítélsz meg, hogy képes-e fára mászni, egész életében azt fogja hinni, hogy buta.