Ịhọrọ agba na HSL dị mma, ma faịlụ stylesheet, nyefe imewe na akwụkwọ akara ka na-eji HEX. Onye ntụgharị a na-ejikọta oghere ahụ ma nye gị koodu hex nke mkpụrụ isii maka ụdị hue, saturation na lightness ọ bụla.
Olee otú HSL gaa HEX si arụ ọrụ
- Gbanwee saturation na lightness gaa fractions: 60% na-abụ 0.6.
- Gụọ chroma C = (1 − |2L − 1|) × S — nke ahụ bụ etu agba si dịpụrụ adịpụ n’ime akwụkwọ ndụọcha (grey).
- Jiri hue kọọ chroma ahụ n’ọwa uhie, akwụkwọ ndụ na anụnụ anụnụ, wee bugharịa atọ ahụ site na L − C/2.
- Kpọọ ọwa ọ bụla site na 255, gbakọọ ya, dee ya dị ka mkpụrụ hex abụọ.
Nke gosiri otu esi eme ya
A na-eme ntinye aka n’otu oge, na nzọụkwụ ikpeazụ, mgbe a na-eme ka ọwa ọ bụla bụrụ integer 0–255. Nsonaazụ bụ koodu HEX kacha nso na ntinye HSL gị ma na-emekarị ka otu ihe ahụ nke ngwa imewe ga-egosi.
HSL na HEX kọwara
Gịnị bụ HSL?
HSL kewapụtara agba n'ime hue (0–360° na igwe agba), saturation (ogologo agba, 0–100%) na lightness (oke ìhè, 0–100%). N'ihi na akụkụ ọ bụla dakọtara na otú mmadụ si kọwaa agba, HSL bụ usoro kacha mfe maka iwulite tints, shades na palettes dị mma — n'aka ma ọ bụ n'ime koodu.
- Sintaksị:
- hsl(H, S%, L%)
- Ókè:
- 0–360°, 0–100%, 0–100%
- Kasị mma maka:
- palettes, tints na shades, theming
Gịnị bụ HEX?
Koodu HEX bụ nọmba hexadecimal nke nwere mkpụrụ isii nke na-echekwa ọwa uhie, akwụkwọ ndụ na anụnụ anụnụ nke agba n'azụ akara #. Kwalite nkeji abụọ n'ime ha na-anọchi otu ọwa, site na 00 (enweghị) ruo FF (juputara), nke na-enye otu 16.7 nde agba dị ka RGB n'usoro mkpirisi. HEX bụ ndabara na CSS, ngwá ọrụ imewe na nduzi ika.
- Sintaksị:
- #RRGGBB
- Ókè:
- 00–FF per channel
- Kasị mma maka:
- CSS, nnyefe imewe, nduzi ika
HSL gaa HEX tebụl ntụaka
Agba CSS a na-ahụkarị, tọgharịrị site na HSL gaa HEX.
| Agba | 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 |