Miten se toimii
Kiinnitä jokainen kanava arvoon 0-255, pyöristä se ja kirjoita sitten kaksi heksadesimaalilukua kanavaa kohti #:n taakse. HSL on johdettu RGB-suhteista: sävy hallitsevasta kanavasta, kylläisyys max ja min välisen etäisyyden perusteella, vaaleus niiden keskiarvosta.
- HEX hyväksyy 3 tai 6 numeroa; arvot asetetaan välille 0–255.
Miksi sillä on merkitystä
Suunnittelutyökalut vievät erilaisia muotoja ja CSS odottaa tiettyjä. Käsin muuntaminen aiheuttaa pyöristysvirheitä, ja kolmella tavalla kirjoitettu sama väri on helppo tarkistaa, kun näet kaikki esitykset vierekkäin.
Toimiva esimerkki
rgb(99, 91, 255) on #635BFF ja hsl(244, 100 %, 68 %). HEX-lomake on se, mitä CSS-kirjoittajat liittävät useimmiten; HSL on helpompi tummentaa tai desaturoida ilman uusia kanavia arvaamatta.
Yleisiä virheitä
- Olettaen, että sama HEX näyttää samalta kaikkialla ilman värinhallintaa.
- Unohtamalla, että kolminumeroinen HEX laajentaa jokaista naarmua kahdesti.
- RGB-kanavien muokkaaminen, kun halusit säätää vaaleutta.
Käytännön vinkkejä
Suunnittele HSL:ssä, kun tarvitset systemaattisia sävyjä ja sävyjä: säilytä sävy ja kylläisyys, vaihda vaaleutta portaittain. Säilytä HEX tulostusta varten, mutta säilytä HSL-merkinnät suunnittelutiedostossa tulevia säätöjä varten.
Kuinka käyttää sitä
- Avaa työkalu. Kaikki toimii selaimesi välilehdessä.
- Liitä tai kirjoita syöte ja valitse sitten haluamasi toiminto.
- Tarkista tulos ja kopioi se yhdellä napsautuksella.
Yleisiä kysymyksiä
Miksi HEX-arvoni on erilainen toisessa työkalussa?
Arvot kiinnitetään 0-255:een ja pyöristetään ja kirjoitetaan sitten isoina HEX. Jotkut työkalut säilyttävät pieniä kirjaimia tai virheellisiä syötteitä.
Mikä on HSL?
Vaihtoehtoinen esitys: sävy asteina, kylläisyys ja vaaleus prosentteina. Siitä on hyötyä värien säätämisessä.
Tarkistaako se kontrastin?
Ei. Tämä muuntaa värimuodot; kontrastin tarkistus on eri työkalu.
Onko tämä työkalu todella ilmainen?
Kyllä. Ei ole tiliä, ei maksumuuria eikä käyttörajaa. Tools Appin rahoittaa aumenso, sen takana oleva studio.
Onko jotain kirjoittamani ladattu?
Ei. Työkalu toimii selaimesi välilehdessä. mitä syötät, sitä ei koskaan lähetetä meille eikä tallenneta.