Déminifier CSS en ligne — Formateur CSS

Déminifiez du CSS compressé instantanément. Restaurez une mise en forme lisible — traitement dans le navigateur.

Chargement…

Déminification CSS

Déminifiez du CSS compressé en ligne. Restaurez une mise en forme lisible pour le débogage.

Fonctionnalités

Restaurez la lisibilité de votre code CSS minifié en ajoutant des espaces et des retours à la ligne.

Déminifier

Restaurez la lisibilité de votre code CSS minifié en ajoutant des espaces et des retours à la ligne.

Package utilisé

CSSO

v5.0.5

CSSO (CSS Optimizer) est un outil puissant pour optimiser les fichiers CSS en supprimant les redondances et en compressant le code.

Exemple de base

CSS minifié

.container{margin:20px;padding:10px;background-color:#fff}.button{color:#000;font-size:16px;border:1px solid #ccc}.card{display:flex;flex-direction:column;gap:12px;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.12)}

CSS formaté

.container {
  margin:20px;
  padding:10px;
  background-color:#fff;
}

.button {
  color:#000;
  font-size:16px;
  border:1px solid #ccc;
}

.card {
  display:flex;
  flex-direction:column;
  gap:12px;
  border-radius:8px;
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}

Options de minification

Options de Beautify

Options d’indentation pour Beautify et Unminify (non utilisées par Minify)

Taille d'indentation

Définit le nombre d'espaces ou de tabs pour l'indentation lors du Beautify et de l'Unminify

Code original

.header{color:red;padding:10px}

Avec 2 espaces

.header {
  color: red;
  padding: 10px;
}

Avec 4 espaces

.header {
    color: red;
    padding: 10px;
}

Différence

Beautify et Unminify utilisentent tous les deux les contrôles d’indentation de la barre d’outils. Minify les ignore.

Type d'indentation

Utilise des espaces ou des tabs pour l'indentation lors du Beautify et de l'Unminify

Code original

.header{color:red;padding:10px}

Avec espaces

.header {
  color: red;
  padding: 10px;
}

Avec tabs

.header {
	color: red;
	padding: 10px;
}

Différence

Les espaces sont plus standards, les tabs peuvent être préférés selon vos conventions de code.

Comment déminifier du CSS en ligne

La déminification CSS restaure un formatage lisible aux feuilles de style compressées. Collez votre CSS minifié dans l'outil pour ajouter indentation, retours à la ligne et organiser les sélecteurs. Utile pour déboguer des styles en production, relire des frameworks CSS tiers ou comprendre des styles fournisseurs.

Beautifier CSS — Formater vos feuilles de style

Notre beautifier CSS applique des règles de formatage cohérentes — indentation standardisée, ordre des propriétés et sélecteurs clairs. Que votre CSS vienne d'un build, d'un minifier ou d'un autre développeur, la beautification le rend propre et maintenable.

Concaténer des fichiers CSS

Combinez plusieurs fichiers CSS en une seule feuille de style pour réduire les requêtes HTTP et simplifier le déploiement. Utilisez la concaténation pour fusionner les fichiers, puis minifiez éventuellement le résultat. Pratique pour les projets sans préprocesseur ou bundler CSS.