Spalvų įrankiai
Konvertuokite spalvų kodus, tikrinkite kontrastą ir kurkite atspalvių paletes. Be registracijos.
Viena spalva. Trys formatai.
Įveskite kodą ir spauskite „Konvertuoti“ arba pasirinkite spalvą rinkiklyje. Skaičiavimai atliekami jūsų naršyklėje; įvestų spalvų į serverį nesiunčiame.
- HEX
#FA5B99- RGB
rgb(250, 91, 153)- HSL
hsl(336.6, 94.08%, 66.86%)
Kontrasto tikrintuvas
Pasirinkite teksto ir fono spalvas. Peržiūrėkite jų derinį ir WCAG 2.2 teksto kontrasto įvertinimus.
HEX kodas, pvz., #171719. Rezultatas atsinaujina įvedus tinkamą spalvą.
Teksto peržiūra
Spalvos padeda skaityti.
Aiškus tekstas prasideda nuo tinkamo kontrasto. Tai įprasto, 16 px dydžio teksto pavyzdys.
Kontrasto santykis 16,04:1
Didelis tekstas – bent 24 CSS px arba 18,67 px paryškintas. Peržiūros antraštė yra 24 px. Santykis rodomas su dviem skaitmenimis po kablelio, tačiau atitiktis vertinama pagal neapvalintą reikšmę.
Tikrinamos dvi neskaidrios sRGB spalvos; skaičiavimai vyksta naršyklėje. Nuotraukų, gradientų ir visos svetainės prieinamumo šis įrankis nevertina. WCAG AA gairės ir AAA gairės.
Atspalvių paletė
Viena bazinė spalva ir šeši jos variantai. Pasirinkite spalvą, nukopijuokite paletę arba patikrinkite, kaip du atspalviai dera tekste.
Tamsesnė 60%
#64243DTamsesnė 40%
#96375CTamsesnė 20%
#C8497ABazinė spalva
#FA5B99Šviesesnė 20%
#FB7CADŠviesesnė 40%
#FC9DC2Šviesesnė 60%
#FDBDD6
Išsaugokite paletę
Patikrinkite spalvų porą
Tamsesni variantai gaunami maišant sRGB kanalus su juoda, šviesesni – su balta po 20, 40 ir 60 %. Kanalai apvalinami iki sveikųjų skaičių. Tai atspalvių pradžia jūsų dizainui; teksto kontrastą patikrinkite atskirai, o spaudos spalvas suderinkite su spaustuve. Skaičiavimai vyksta jūsų naršyklėje.
Kuo skiriasi spalvų kodai?
HEX
Trumpas užrašas su # ženklu. Pavyzdžiui, #FF0000 reiškia raudoną spalvą.
RGB
Raudonos, žalios ir mėlynos kanalai nuo 0 iki 255. Ta pati raudona užrašoma rgb(255, 0, 0).
HSL
Atspalvio kampas, sodrumas ir šviesumas. Raudonos pavyzdys: hsl(0, 100%, 50%). Šis formatas padeda suprasti spalvos charakterį.
Konverteris skirtas neskaidrioms sRGB spalvoms. RGB rezultatas apvalinamas iki sveikųjų kanalų, HSL – iki dviejų skaitmenų po kablelio. Plačiau apie spalvų formatus.
O jei ruošiate spaudai?
Ekrano kodas negarantuoja tokios pačios spalvos spaudinyje. Spalvų profilį, medžiagą ir failo paruošimą derinkite su spaustuve.
Spalvos jūsų prekės ženklui
Spalvos kodas – tik pradžia. Nuoseklų įvaizdį kuria paletė, tipografija ir aiškios jų naudojimo taisyklės.
Apie firminio stiliaus kūrimą