HSL / HSLA

---

HSL qiymati

HSL — hue (rang to‘ni), saturation (to‘yinganlik) va lightness (yorug‘lik) so‘zlarining qisqartmasi.

CSS’da rang rang ohangi (hue), to‘yinganlik (saturation) va yorqinlik (lightness) orqali mana bunday ko‘rinishda belgilanishi mumkin (HSL):

hsl(RANG T’ONI, TO‘YINGANLIK, YORUG‘LIK)

Rang ohangi (hue) — rang doirasidagi daraja (0 dan 360 gacha):

• 0 (yoki 360) — qizil
• 120 — yashil
• 240 — ko‘k

TO‘YINGANLIK foiz qiymatdir: 0% — kulrang soyani, 100% — to‘liq rangni anglatadi.

YORUG‘LIK ham foiz; 0% qora, 50% ochiq yoki qorong‘i emas, 100% oq.

Quyidagi HSL qiymatlarini aralashtirib sinab ko‘ring:

---

TO‘YINGANLIK

To‘yinganlikni rangning intensivligi sifatida tasvirlash mumkin.

100% — toza rang, kulrang soyalar yo‘q.

50% — 50% kulrang, lekin rangni baribir ko‘rish mumkin.

0% — to‘liq kulrang; rangni endi ko‘rish mumkin emas.

---

---

YORUG‘LIK

Rangning yorqinligi unga qancha yorug‘lik bermoqchi ekaningiz bilan tavsiflanadi: 0% — yorug‘liksiz (qora), 50% — 50% yorug‘lik (na qorong‘i na yorug‘) va 100% — to‘liq yorqinlik (oq).

---

Kulrang tuslari

Kulrang soyalar ko‘pincha rang ohangi va to‘yinganlikni 0 qilib, yorqinlikni 0% dan 100% gacha sozlash orqali belgilanadi — qorong‘i/yorug‘ soyalar olish uchun:

---

HSLA qiymati

HSLA rang qiymatlari HSL rang qiymatlarining alfa kanal bilan kengaytmasi — alfa kanal rangning shaffofligini belgilaydi.

HSLA rang qiymati quyidagicha belgilanadi:

hsla(hue, TO‘YINGANLIK, lightness, alpha)

Alfa parametri — 0.0 (to‘liq shaffof) va 1.0 (umuman shaffof emas) orasidagi son:

Quyidagi HSLA qiymatlarini aralashtirib sinab ko‘ring:

---

---

---