Trouver son code couleur HTML : Facile :-) - code HTML
Mettre en forme un texte en CSS
A découvrir les boutons de manchette Geek :) - Des idées de cadeaux à petits prix :)Trouver son code couleur HTML !
Les couleurs avec du CSS sont les mêmes que celles avec un code HTML.
Pour faire référence à d'autres couleurs, vous devrez utiliser le code hexadécimal.
C'est bien sûr un peu moins parlant mais universel.
Vous pouvez choisir votre couleur en cliquant ici : <-- Cliquer ici
Il existe des couleurs nommées normalisées :
| #00FFFF Aqua |
#000000 Black |
#0000FF Blue |
#FF00FF Fuchsia |
#808080 Gray |
#008000 Green |
#00FF00 Lime |
#800000 Maroon |
| #000080 Navy |
#808000 Olive |
#800080 Purple |
#FF0000 Red |
#C0C0C0 Silver |
#008080 Teal |
#FFFFFF White |
#FFFF00 Yellow |
Il est possible d'avoir l'ensemble des couleurs de l'arc en ciel :) avec une sa valeur hexadecimal :
Méthodes simples pour trouver des codes couleurs
Pour mieux s’intégrer dans les widgets, il est primordial que tout blogueur, graphiste ou designer doit forcément avoir une bonne connaissance des codes couleurs d’une image. C’est d’ailleurs pour vous aider à en savoir plus sur le sujet que vous retrouverez dans cet article plusieurs informations qui pourront vous éclairer.
Comment trouver le code couleur d’une image ?
Plusieurs outils peuvent vous aider à trouver le code couleur d’une image, mais ici nous vous donnerons un exemple de colormind.io qui vous garantira un résultat efficace. Pour l’utiliser, il faudra :
- Cliquer sur colormind.io
- Ensuite, Choisir l’image que vous souhaitez sonder.
- Pour finir, cliquer une fois encore sur « Generate »
Couleur HTML et CSS
En CSS, est bien pratique de mettre en forme un contenu et le définir une seule fois dans sa feuille de style.
- color: Gestion de la couleur du texte
- letter-spacing: Espace entre les lettres
- text-align: Alignement d'un texte
- text-decoration: Habiblement d'un texte
A savoir : Dans ce chapitre, la notion d'héritage est appliquée. (voir notion d'héritage sur ce lien)
Comment trouver le code couleur HTML ?
Vous pouvez fixer la couleur d'un texte comme suivant :
color: valeur;
Les différentes valeurs sont :
- Nom de la couleur - exemple:(red, black...)
- Nombre hexadecimal - exemple:(#ff0000, #000000)
- Code RGB - exemple:(rgb(255, 0, 0), rgb(0, 0, 0))
Vous remarquerez que le curseur se changera en loupe, ciblez donc la couleur souhaitée pour avoir le code couleur HTLM. Il faut relever qu’il s’affichera juste en dessous. Cliquez ensuite sur copier ce code dans le presse papier. Après avoir respecté ces étapes, il vous sera possible de le récupérer dans n’importe quel logiciel.
Voir un exemple :
Voici un texte en bleu Voir le code CSS :
.bleutext{ color: #336699; } Voir le code dans l'élément
<span class="bleutext">Voici un texte en bleu</span>
Espace entre les lettres
Vous pouvez ajuster les espaces entre les lettres dans un texte. Vous pouvez mettre une valeur négative.
letter-spacing: valeur;
Les valeurs possibles sont :
- normal
- une valeur en px
Voir un exemple :
Voici des lettres espacées de 5px
Voir le code CSS :
.espace5px{ letter-spacing: 5px; } Voir le code dans l'élément
<span class="espace5px">Voici des lettres espacées de 5px</span>
Alignement d'un texte
Vous pouvez ajuster la position d'un texte :
text-align: valeur;
Les valeurs possibles sont :
- Gauche
- droite
- centre
- justifié
.align_left{ text-align: left; } .align_left{ text-align: center; } .align_left{ text-align: right; }
Le CSS en 3 questions/réponses - en bref
