La propriété color en CSS est utilisée pour définir la couleur du texte d’un élément HTML. Elle peut accepter plusieurs types de valeurs pour spécifier la couleur :

Noms de couleurs : Vous pouvez utiliser des noms de couleurs standardisés comme “red”, “blue”, ou “green”. Ces noms sont définis par les spécifications CSS et sont généralement bien supportés par tous les navigateurs.

Codes hexadécimaux : Cette méthode utilise un code à six chiffres précédé d’un dièse (#) pour représenter la couleur. Les deux premiers chiffres représentent la quantité de rouge, les deux suivants le vert, et les deux derniers le bleu. Les codes hexadécimaux permettent de spécifier une large gamme de couleurs.

Valeurs RGB : Cette notation utilise trois nombres pour définir la quantité de rouge, de vert et de bleu dans une couleur. Chaque valeur peut varier de 0 à 255. Cette méthode offre une grande précision pour définir des couleurs.

Valeurs RGBA : Semblable à RGB, mais ajoute un quatrième composant pour la transparence, appelé alpha. La valeur alpha va de 0 (complètement transparent) à 1 (complètement opaque), permettant des effets de transparence.

Valeurs HSL : La couleur est définie en termes de teinte (la couleur), saturation (l’intensité de la couleur), et luminosité (la clarté ou obscurité de la couleur). Ce modèle est souvent utilisé pour ajuster les couleurs de manière intuitive.

Valeurs HSLA : Comme HSL, mais inclut un composant alpha pour la transparence. Cela permet de spécifier non seulement la couleur mais aussi son degré de transparence.

/* Définit la couleur du texte en utilisant le nom de la couleur */
p {
    color: red;
}

/* Définit la couleur du texte en utilisant un code hexadécimal */
p {
    color: #ff5733;
}

/* Définit la couleur du texte en utilisant la notation RGB */
p {
    color: rgb(255, 87, 51);
}

/* Définit la couleur du texte en utilisant la notation RGBA avec transparence */
p {
    color: rgba(255, 87, 51, 0.5);
}

/* Définit la couleur du texte en utilisant la notation HSL */
p {
    color: hsl(9, 100%, 60%);
}

/* Définit la couleur du texte en utilisant la notation HSLA avec transparence */
p {
    color: hsla(9, 100%, 60%, 0.5);
}