Catégories

← View All Tools

Raccourcisseur de Couleur

Raccourcir les codes HEX à 6 chiffres en 3 chiffres (ex: #FFFFFF en #FFF)

Inclure les couleurs qui ne peuvent pas être raccourcies avec des raisons

Points clés

Catégorie
Design
Types d’entrée
textarea, select, checkbox
Type de sortie
text
Couverture des échantillons
4
API disponible
Yes

Vue d’ensemble

Optimisez vos feuilles de style CSS et réduisez le poids de vos fichiers en convertissant automatiquement vos codes couleurs hexadécimaux de 6 chiffres en leur version courte de 3 chiffres.

Quand l’utiliser

  • •Lors de l'optimisation de fichiers CSS pour améliorer les performances de chargement web.
  • •Pour standardiser une palette de couleurs dans un projet de design ou de développement.
  • •Lorsque vous souhaitez nettoyer et simplifier votre code source en supprimant les caractères inutiles.

Comment ça marche

  • •Copiez et collez vos codes couleurs HEX dans la zone de saisie prévue à cet effet.
  • •Sélectionnez le format de sortie souhaité, comme la casse ou la présence du symbole dièse.
  • •Cliquez sur le bouton de conversion pour obtenir instantanément vos codes optimisés.
  • •Copiez le résultat final pour l'intégrer directement dans votre projet.

Cas d’usage

Minification de fichiers CSS pour les sites web à fort trafic.
Nettoyage de bibliothèques de design ou de fichiers de configuration de thèmes.
Conversion rapide de palettes de couleurs pour les développeurs front-end.

Exemples

1. Optimisation d'une feuille de style CSS

Développeur Front-end
Contexte
Un développeur doit réduire la taille d'un fichier CSS volumineux pour améliorer le score de performance Google PageSpeed.
Problème
Le fichier contient de nombreux codes HEX à 6 chiffres inutiles qui alourdissent le code.
Comment l’utiliser
Coller la liste des couleurs du fichier, sélectionner le format 'CSS' et copier le résultat.
Configuration d’exemple
Format: CSS
Résultat
Le fichier CSS est plus léger et les couleurs sont uniformisées au format court.

2. Standardisation de palette

Designer UI
Contexte
Un designer prépare une charte graphique pour une équipe de développement.
Problème
Les codes couleurs sont mélangés entre des formats longs et courts, ce qui manque de cohérence.
Comment l’utiliser
Saisir tous les codes de la palette et choisir le format 'lowercase' pour une uniformité totale.
Configuration d’exemple
Format: lowercase
Résultat
Une liste de codes couleurs propre, cohérente et prête à être intégrée dans le code source.

Tester avec des échantillons

design
Exemples de codes couleur
Collection de codes de couleur dans différents formats (Hex, RGB, HSL, couleurs nommées) pour les tests de validation
title token color
sample
Échantillons Audio OPUS Libres de Droits
Collection audio OPUS nouvelle génération avec compression et qualité supérieures, optimisée pour streaming moderne incluant sons de la nature et musique de méditation
task compress
sample
Échantillons Audio AAC Libres de Droits
Collection audio AAC de haute qualité pour tests et développement, incluant sons de la nature et musique de méditation
task compress
sample
Échantillons Audio WAV Libres de Droits
Collection audio WAV non compressé pour tests et développement, incluant sons de la nature et musique de méditation
task compress
sample

Hubs associés

Outils Design pour Convert
Découvrez 98 outils design pour des workflows de convert et comparez rapidement des utilitaires proches.
Outils Design pour Generate
Découvrez 19 outils design pour des workflows de generate et comparez rapidement des utilitaires proches.
Outils Json pour Convert
Découvrez 100 outils json pour des workflows de convert et comparez rapidement des utilitaires proches.
Outils Image pour Convert
Découvrez 100 outils image pour des workflows de convert et comparez rapidement des utilitaires proches.

FAQ

Toutes les couleurs HEX peuvent-elles être raccourcies ?

Non, seules les couleurs dont les paires de caractères sont identiques (ex: #AABBCC) peuvent être réduites à 3 chiffres (#ABC).

Que se passe-t-il si une couleur ne peut pas être raccourcie ?

Si vous activez l'option d'affichage des couleurs non raccourcissables, l'outil vous indiquera lesquelles ne respectent pas le format requis.

L'outil modifie-t-il la couleur réelle ?

Absolument pas. Le format à 3 chiffres est une notation équivalente au format à 6 chiffres pour les couleurs compatibles.

Puis-je convertir plusieurs couleurs à la fois ?

Oui, vous pouvez coller une liste de codes couleurs, un par ligne, pour les traiter en une seule opération.

Le format CSS est-il supporté ?

Oui, nous proposons une option spécifique pour formater vos codes couleurs directement pour une utilisation dans vos fichiers CSS.

Documentation de l'API

Point de terminaison de la requête

POST /fr/api/tools/color-shortener

Paramètres de la requête

Nom du paramètre Type Requis Description
colors textarea Oui -
format select Oui -
includeUnshortenable checkbox Non Inclure les couleurs qui ne peuvent pas être raccourcies avec des raisons

Format de réponse

{
  "result": "Processed text content",
  "error": "Error message (optional)",
  "message": "Notification message (optional)",
  "metadata": {
    "key": "value"
  }
}
Texte: Texte

Documentation de MCP

Ajoutez cet outil à votre configuration de serveur MCP: 

{
  "mcpServers": {
    "elysiatools-color-shortener": {
      "name": "color-shortener",
      "description": "Raccourcir les codes HEX à 6 chiffres en 3 chiffres (ex: #FFFFFF en #FFF)",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=color-shortener",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Vous pouvez chaîner plusieurs outils, par ex.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, max 20 outils.

Si vous rencontrez des problèmes, veuillez nous contacter à [email protected]