Kif tispeċifika l-koluri fil-CSS?

Question

Accepted Answer

CSS joffri diversi formati ta' kuluri. Huma jiprodużu l-istess kuluri — l-għażla hija dwar il-leggibilità u jekk tkun għandek bżonn trasparenza.

```css
.a { color: red; }                      /* named keyword (~150 of them) */
.b { color: #ff5733; }                  /* hex: #RRGGBB */
.c { color: #ff5733cc; }                /* hex with alpha: #RRGGBBAA */
.d { color: rgb(255 87 51); }           /* red green blue (0–255) */
.e { color: rgb(255 87 51 / 0.8); }     /* with 80% opacity */
.f { color: hsl(9 100% 60%); }          /* hue saturation lightness */
.g { color: hsl(9 100% 60% / 0.5); }    /* HSL with alpha */
```

## Għaliex HSL ħafna drabi l-aktar utli

HSL jiddeskrivi l-kulur bħala **H**ue (0–360° fuq ir-rota tal-kulur), **S**aturation, u **L**ightness — li jikkorrispondi għal kif il-bnedmin jaħsbu dwar il-kulur, u għalhekk jirriżultaw varjazzjonijiet intuwittivi:

```css
:root { --brand-h: 220; }
.primary       { background: hsl(var(--brand-h) 80% 50%); }
.primary-light { background: hsl(var(--brand-h) 80% 70%); } /* just raise lightness */
.primary-dark  { background: hsl(var(--brand-h) 80% 30%); } /* just lower it */
```

Il-ġenerazzjoni ta' sfumatura aktar ċara/skura hija trivjali — ibdel numru wieħed. Li tagħmel dak bil-hex jew rgb jeħtieġ li tikkalkula mill-ġdid l-kanali kollha.

## Alpha / trasparenza

```css
background: rgb(0 0 0 / 0.5); /* 50% transparent black — for overlays */
```
\
-Sintassi `/ alpha` (0 = trasparenti, 1 = opaku) hija kif tagħmel kuluri semi-trasparenti, utli għal overlays u shadows. (Nota: `opacity` fuq element jagħmel fade għall-element *kollu*, inkluż il-tfal — alpha colors jagħmu fade biss dak il-kulur.)

## Formati moderni

```css
color: oklch(70% 0.15 220); /* perceptually-uniform; better for color systems */
```

## Għaliex huwa importanti

L-għarfien tal-formati jippermettilok tintgħażel l-għodda t-tajba: hex/rgb għal kuluri żfinzjoni waħda, **HSL/OKLCH għal sistemi ta' disinj** (faċli, varjazzjonijiet ta' sfumatura intuwittivi), u s-sintassi `/ alpha` għat-trasparenza.

HSL speċjalment jagħmel il-bini ta' paletti ta' kuluri konsistenti u temable ħafna itqal.