Maikaʻi ka koho kala ma HSL, akā holo mau nā stylesheet, nā hoʻololi hoʻolālā a me nā palapala brand ma HEX. Hoʻopiha kēia mea hoʻololi i kēlā ʻāhole a hāʻawi aku i ka code ʻeono-helu no kēlā me kēia hui hue, saturation a me lightness.
Pehea e hana ai ka kahuli mai HSL i HEX
- Huli i ka saturation a me ka lightness i mau ʻāpana: lilo ka 60% i 0.6.
- Helu i ka chroma C = (1 − |2L − 1|) × S — ʻo ia ka mamao o ka waihoʻoluʻu mai ka ʻeleʻele/keʻokeʻo (grey).
- E hoʻohana i ka hue e kau i kēlā chroma ma nā ʻāpana ʻulaʻula, ʻōmaʻomaʻo a me polū, a laila ʻoki i nā ʻekolu a pau e L − C/2.
- Hoʻokahi i kēlā me kēia ʻāpana ma 255, hoʻopili i ka uila, a kākau i kēlā me kēia ma nā helu hexadecimal ʻelua.
Laʻana i hana
Hoʻopiha ʻia ka pōʻaiapuni hoʻokahi i ka ʻanuʻu hope, i ka wā e paʻa ai kēlā me kēia ʻāpana i kahi waiwai holoʻokoʻa 0–255. ʻO ka hopena ʻo ia ka HEX kokoke loa i kāu huina HSL a maʻamau like me ka mea e hōʻike ana kekahi mea hana hoʻolālā.
HSL a me HEX wehewehe
He aha ka HSL?
Māhele ka HSL i kahi waihoʻoluʻu i ka hue (0–360° ma ke huila waihoʻoluʻu), saturation (pehea ka waihoʻoluʻu, 0–100%) a me ka lightness (pehea ka ʻālohilohi, 0–100%). No ka mea e hoʻopili ana kēlā me kēia ʻāpana i ke ʻano e wehewehe ai nā kānaka i ka waihoʻoluʻu, ʻo HSL ka ʻano maʻalahi no ka hana i nā tints, shades a me nā paʻi pūnāwai pono — ma lima a i ʻole ma ke code.
- Hana kikokiko:
- hsl(H, S%, L%)
- Awāwa:
- 0–360°, 0–100%, 0–100%
- Mākou kūpono no:
- nā paʻi pūnāwai, tints a me nā shades, theming
He aha ka HEX?
He helu HEX ka code he ʻekolu mau helu hekanoma e mālama i ka ʻulaʻula, ʻōmaʻomaʻo a me ke kanaloku polū o kahi waihoʻoluʻu ma hope o ka # alakaʻi. Hoʻokahi pā pā no kēlā me kēia kanaloku, mai 00 (ʻaʻole) a i FF (piha), e hāʻawi ana i nā waihoʻoluʻu 16.7 miliona like me RGB i kahi ʻōlelo pōkole. HEX ka maʻamau i CSS, nā mea hana hoʻolālā a me nā lula inoa brand.
- Hana kikokiko:
- #RRGGBB
- Awāwa:
- 00–FF per channel
- Mākou kūpono no:
- CSS, hoʻokaʻaʻike hoʻolālā, lula inoa
HSL to HEX reference table
Nā waihoʻoluʻu CSS maʻamau loa, i kahuli ʻia mai HSL a i HEX.
| Waihoʻoluʻu | HSL | HEX |
|---|---|---|
| black | hsl(0, 0%, 0%) | #000000 |
| white | hsl(0, 0%, 100%) | #FFFFFF |
| red | hsl(0, 100%, 50%) | #FF0000 |
| lime | hsl(120, 100%, 50%) | #00FF00 |
| blue | hsl(240, 100%, 50%) | #0000FF |
| yellow | hsl(60, 100%, 50%) | #FFFF00 |
| orange | hsl(39, 100%, 50%) | #FFA600 |
| teal | hsl(180, 100%, 25%) | #007F80 |
| purple | hsl(300, 100%, 25%) | #80007F |
| gray | hsl(0, 0%, 50%) | #808080 |