Jokainen väriformaatti kuvaa samaa asiaa eri kielellä: HEX tyyleille, RGB näytöille ja koodille, HSL palettien rakentamiseen ja CMYK painamiseen. Valitse tarvittava muunnos ja saat tarkan arvon, reaaliaikaisen esikatselun ja käytetyn kaavan.
Neljä väriformaattia
Mikä on HEX?
HEX-koodi on kuusinumeroinen heksadesimaali, joka tallentaa värin punaisen, vihreän ja sinisen kanavan eteen liitetyn # -merkin jälkeen. Kukin kahden merkin pari vastaa yhtä kanavaa, arvot 00 (ei lainkaan) – FF (täysi), mikä antaa saman 16,7 miljoonaa väriä kuin RGB mutta tiiviimmässä muodossa. HEX on oletus CSS:ssä, suunnittelutyökaluissa ja brändiohjeissa.
- Syntaksi:
- #RRGGBB
- Parhaiten soveltuu:
- CSS, suunnittelun luovutus, brändiohjeet
Mikä on RGB?
RGB kuvaa väriä kolmella valokanavalla — red, green ja blue — kukin 0–255. Se peilaa sitä, miten näytöt toimivat: kaikki kanavat 255 antavat valkoisen, kaikki 0 mustan. RGB on oikea valinta, kun sinun täytyy laskea väreillä, ja rgba() lisää läpinäkyvyyden päälle.
- Syntaksi:
- rgb(R, G, B)
- Parhaiten soveltuu:
- koodi, canvas, läpinäkyvyys rgba():lla
Mikä on HSL?
HSL jakaa värin sävyyn (0–360° väripyörällä), kylläisyyteen (kuinka värikäs, 0–100%) ja vaaleuteen (kuinka kirkas, 0–100%). Koska kukin osa vastaa tapaa, jolla ihmiset kuvaavat väriä, HSL on helpoin formaatti sävyjen, tummennosten ja yhtenäisten palettien rakentamiseen — käsin tai koodissa.
- Syntaksi:
- hsl(H, S%, L%)
- Parhaiten soveltuu:
- paletit, sävyt ja tummennokset, teemoittaminen
Mikä on CMYK?
CMYK on nelivärimalli painatuksessa: cyan, magenta, yellow ja key (musta), kukin prosenttiosuutena 0–100. Muste poistaa valoa sen sijaan, että se säteilisi, joten CMYK kattaa vähemmän värisävyjä kuin näyttö — siksi kirkkaat näyttövärisävyt usein näyttävät himmeämmiltä painettuna.
- Syntaksi:
- cmyk(C%, M%, Y%, K%)
- Parhaiten soveltuu:
- paino, pakkaukset, painovalmiit taitotiedostot