HTML Color Codes

Sélecteur de couleur HTML pour les formats RGB HEX HSL

Obtenez facilement des codes de couleur HTML CSS pour votre site Web à l'aide du sélecteur de couleurs, convertissez le format de couleur entre HEX, RGB, HSL, HSV.

Choisir une couleur

Entrer une valeur de couleur

Ou utilisez le sélecteur HTML5

Couleur sélectionnée

Rouge: 0
Vert: 255
Bleu: 255
HUE (Degrés): 180
Luminosité: 0.7
Alpha: 1
Hex: #00ffff
RGB: rgb(0, 255, 255)
HSL: hsl(180, 100%, 50%)
Groupe de couleurs: Cyan
Partager:
Exemple de couleur CSS3

<style>
  div {
    color: #00ffff;
    color: rgb(0, 255, 255);
    color: hsl(180, 100%, 50%);
  }
</style>
Styles plus foncés et plus clairs

<style>
  .darken {
    color: rgb(0, 230, 230);
  }
  .lighten {
    color: rgb(25, 255, 255);
  }
</style>

Obtenir des couleurs à partir d'une image

get pixel color from pic

Choisir une couleur et créer une palette

select color and create palette

Qu'est-ce qu'un code couleur HTML ?

Les codes couleur HTML sont un moyen de spécifier les couleurs dans la conception Web. Ces codes sont utilisés en HTML et CSS pour définir les couleurs d'éléments tels que le texte, les arrière-plans, les bordures, et plus encore. Comprendre les codes couleur HTML est essentiel pour créer des pages Web visuellement attrayantes et cohérentes.

Par exemple, la couleur rouge peut être identifiée en utilisant les formats suivants :

Types de codes couleur HTML


Codes couleur hexadécimaux :
  • La manière la plus courante de spécifier les couleurs en HTML et CSS est d'utiliser des codes couleur hexadécimaux (hex). Un code couleur hexadécimal est une combinaison de six chiffres et lettres définie par son mélange de composants rouge, vert et bleu (RGB).
  • Format : #RRGGBB
  • Exemple : #FF5733 représente une nuance d'orange.
  • Chaque paire de chiffres correspond à l'intensité du rouge, du vert et du bleu, respectivement, sur une échelle de 00 (aucune intensité) à FF (intensité maximale).
Codes couleur RGB :
  • Les codes couleur RGB définissent les couleurs en fonction de leurs composants rouge, vert et bleu.
  • Format : rgb(rouge, vert, bleu)
  • Exemple : rgb(255, 87, 51) est l'équivalent RGB de #FF5733.
  • Chaque composant (rouge, vert et bleu) est spécifié comme un nombre entre 0 et 255
Codes couleur RGBA :
  • Similaire à RGB, mais inclut un composant alpha pour l'opacité.
  • Format : rgba(rouge, vert, bleu, alpha)
  • Exemple : rgba(255, 87, 51, 0.5) spécifie la même couleur avec une opacité de 50 %.
Codes couleur HSL :
  • HSL signifie Teinte (Hue), Saturation et Luminosité (Lightness).
  • Format : hsl(teinte, saturation%, luminosité%)
  • Exemple : hsl(9, 100%, 60%) est une autre manière de représenter la couleur #FF5733
  • La teinte est un degré sur la roue chromatique (de 0 à 360), la saturation est un pourcentage (0% est en niveaux de gris, 100% est en couleur pleine), et la luminosité est également un pourcentage (0% est noir, 100% est blanc).
Codes couleur HSLA :
  • Similaire à HSL, mais inclut un composant alpha pour l'opacité.
  • Format : hsla(teinte, saturation%, luminosité%, alpha)
  • Exemple : hsla(9, 100%, 60%, 0.5) spécifie la même couleur avec une opacité de 50 %.
Utilisation des codes couleur HTML :

Les codes couleur HTML peuvent être utilisés dans diverses propriétés CSS pour styliser les éléments Web. Par exemple :

<style>
    .text-color {
        color: #FF5733;
    }
    .background-color {
        background-color: rgb(255, 87, 51);
    }
    .border-color {
        border: 2px solid hsl(9, 100%, 60%);
    }
</style>
<p class="text-color">This text is orange.</p>
<div class="background-color">This background is orange.</div>
<div class="border-color">This border is orange.</div>

Dans cet exemple, le texte, l'arrière-plan et la bordure sont stylisés en utilisant différents types de codes couleur HTML, tous représentant la même nuance d'orange.

Les codes couleur HTML sont un aspect fondamental de la conception Web, permettant aux développeurs de définir et de manipuler les couleurs avec précision. En comprenant les codes couleur hex, RGB, RGBA, HSL et HSLA, vous pouvez créer des pages Web visuellement cohérentes et attrayantes qui améliorent l'expérience utilisateur.