Extraction des codes couleur hexadécimaux à partir du texte

Recherche et extraction en un clic de tous les codes de couleur hexadécimaux du texte

Comment utiliser l'extracteur de code couleur hexadécimal

Collez du CSS, HTML, des notes de conception ou tout texte contenant des couleurs hexadécimales. L’outil trouve des codes tels que #0F5C8C et #abc, puis les liste pour copie ou téléchargement. Le traitement s'effectue dans votre navigateur.

  1. Collez votre texte dans la boîte de saisie (feuilles de style, extraits HTML ou notes de conception).
  2. Choisir des options
    • Supprimer les couleurs en double — garder chaque couleur une fois.
    • Standardiser le format (majuscules) — normaliser en hexadécimal majuscule.
    • Inclure les couleurs en forme courte (#abc) — correspond également au hexadécimal à 3 chiffres.
    • Développer la forme courte en 6 chiffres (#abc → #AABBCC) — transforme #abc en #AABBCC lorsque la forme courte est activée.
    • Afficher les aperçus de couleurs — afficher les échantillons à côté des valeurs.
  3. Cliquez sur « Extraire les codes de couleur ».
  4. Copier, télécharger ou revoir la liste extraite et les aperçus.

Hex color extractor example

Cas d'utilisation courants

  • Audits CSS / thème : Extraire toutes les couleurs hexadécimales d'une feuille de style ou d'un fichier de jetons de design.
  • Cohérence de la marque : Collecter les couleurs utilisées dans les modèles HTML ou le balisage des e-mails.
  • Remise de conception : Extraire les couleurs des notes ou du CSS exporté avant de reconstruire un kit d'interface utilisateur.
  • Nettoyage : Trouvez les couleurs restantes ou en double avant de consolider une palette.

Quels formats sont détectés ?

  • Hexadécimal à 6 chiffres : #0F5C8C, #ff5733 (avec ou sans # selon le contexte dans le texte
  • Forme courte à 3 chiffres : #abc, #F00 (lorsque « Inclure la forme abrégée » est activé)
  • Forme courte développée : #abc → #AABBCC lorsque l'expansion est activée

Les fonctions RGB/HSL ne sont pas converties ici — cet outil extrait uniquement les codes couleur hexadécimaux.

Exemple : Avant et Après

Avec « Inclure la forme courte », « Développer la forme courte », « Supprimer les doublons » et « Standardiser le format » activés :

Entrer CSSCouleurs extraites
.btn {
  color: #ff0000;
  background: #abc;
  border-color: #FF0000;
  outline: #0F5C8C;
}
#FF0000
#AABBCC
#0F5C8C

#ff0000 et #FF0000 s'effondrer en une seule valeur en majuscule. Court #abc s'étend à #AABBCC.

Questions Fréquemment Posées (FAQ)

L'outil télécharge-t-il mon CSS ou mon HTML ?

Non. L'extraction s'exécute localement dans votre navigateur. Votre texte n'est pas envoyé à nos serveurs.

Pourquoi une couleur courte comme #abc est-elle manquante ?

Activer Inclure les couleurs en forme courte. Activer éventuellement Développer la forme abrégée pour lister l'équivalent à 6 chiffres.

Peut-il extraire les valeurs rgb() ou hsl() ?

Pas sur cette page. Utilisez un convertisseur de couleur dédié si vous avez besoin de conversion RGB ↔ Hex (par exemple Hex en RVB / RVG en Hex).

Le dièse (#) est-il obligatoire ?

Les couleurs les plus assorties incluent #. Activez la standardisation/majuscules pour maintenir une liste cohérente pour les systèmes de conception.

Confidentialité

Toute la correspondance se fait sur votre appareil avec JavaScript. Nous ne stockons pas le texte que vous collez ni les couleurs que vous extrayez.