Minificateur et formateur CSS
Réduisez le CSS en supprimant les commentaires et en réduisant les espaces, ou embellissez le CSS compressé en règles lisibles et indentées. Les deux directions s'exécutent dans le navigateur sur le texte que vous collez, cela fonctionne donc autant pour un extrait dont vous avez hérité que pour celui que vous expédiez.
Comment ça marche
- 1
Collez la feuille de style ou le bloc de règles que vous souhaitez modifier.
- 2
Choisissez minify pour supprimer les commentaires et les espaces, ou embellissez pour réindenter le CSS compressé.
- 3
Comparez les tailles pour voir combien coûtait le formatage.
- 4
Copiez le résultat dans votre feuille de style, composant ou modèle.
Avantages et avantages clés
Les deux sens
Réduisez pour la livraison ou embellissez un fichier compressé que vous devez lire et modifier.
Plus sûr que la réduction du code
CSS a une grammaire plus simple que JavaScript, donc la suppression des commentaires et des espaces modifie rarement le comportement.
Aucune étape de construction
Pratique pour un bloc de style en ligne, un modèle d'e-mail ou un champ CMS dans lequel un bundler n'est pas impliqué.
Fonctionne localement
Votre feuille de style est traitée dans l'onglet et n'est jamais téléchargée.
Pourquoi les gens l’utilisent
- Compresser un bloc de style avant de l'insérer dans un en-tête de page ou un e-mail.
- Reformatage d'une feuille de style minifiée que vous devez lire ou déboguer.
- Nettoyage des CSS copiés à partir d'un générateur ou d'un export d'outil de conception.
- Vérifier la différence de taille avant de décider d'ajouter ou non une étape de construction.
Formats et options pris en charge
| Entrée | Règles CSS, feuilles de style entières ou fragments collés sous forme de texte |
|---|---|
| Réduire les suppressions | Commentaires, sauts de ligne et espaces redondants entre les sélecteurs, les propriétés et les valeurs |
| Embellir ajoute | Sauts de ligne et indentation pour chaque règle et déclaration |
Confidentialité et traitement des données
Votre CSS est entièrement traité dans l'onglet du navigateur et n'est jamais envoyé à notre serveur.
Limites et choses à savoir
- Cet outil ne fusionne pas les sélecteurs en double, ne raccourcit pas les valeurs de couleur, ne réorganise pas les déclarations ou ne supprime pas les règles inutilisées – ce sont des optimisations effectuées par un optimiseur CSS dédié.
- Les espaces sont importants dans les valeurs de contenu, les propriétés personnalisées et certaines notations fonctionnelles ; vérifiez n'importe quelle règle avec une déclaration content ou var() après la minification.
- Beautify restaure la structure, pas le formatage d'origine. Les commentaires supprimés par une minification précédente ne peuvent pas être récupérés.
Dépannage
Un style a cessé de s'appliquer après une réduction
Recherchez les valeurs de contenu, les propriétés personnalisées ou les chaînes de requête multimédia pour lesquelles un espace supprimé était important. Restaurez l'espace dans cette déclaration.
Le fichier est toujours volumineux après minification
La plupart des véritables économies CSS proviennent de la suppression des règles inutilisées et de la compression du serveur. Activez gzip ou Brotli et vérifiez les sélecteurs morts avant d'optimiser davantage la syntaxe.
CSS Minifier & Beautifier — Compress Stylesheets Online Free
Minify CSS online to cut stylesheet weight before deployment, or beautify compressed CSS back into readable, indented rules. This free CSS compressor removes comments, line breaks and redundant whitespace without ever altering how a single declaration renders.
- Minify CSS to reduce file size — typical hand-written stylesheets shrink noticeably, which directly improves Largest Contentful Paint because CSS is a render-blocking resource.
- CSS beautifier built in — paste a minified production stylesheet from a live site and re-indent it into structured, readable CSS for debugging or auditing.
- Safe by design — the compressor only removes comments and insignificant whitespace — selectors, specificity, cascade order and media queries come through equivalent.
- Better Core Web Vitals — smaller CSS means fewer bytes on the critical path, fewer render-blocking milliseconds and a measurably faster first paint on mobile connections.
- Runs entirely in your browser — proprietary design-system CSS and unreleased styles are processed locally with no upload, no account and no rate limit.
Use it alongside the JavaScript Minifier to compress your full front-end bundle, and the JSON Formatter for the config files that ship with it.
Questions fréquemment posées
Will minifying break my stylesheet?
Rarely. CSS has a simple grammar, so removing comments and whitespace is usually safe. The exceptions are declarations where a space is meaningful — content values, custom properties and some functional notations — so check those specific rules after minifying.
How much smaller will my CSS get?
Typically 10-30 percent, depending on how much of the file is indentation and comments. That is worth having, but enabling gzip or Brotli on your server saves considerably more, and the two stack.
Can it remove unused CSS?
No. Finding unused rules requires analysing your HTML and JavaScript, which a text-level minifier cannot do. Use a purge tool wired into your build for that.
La réduction modifie-t-elle l'exécution du CSS ?
Non! La minification supprime uniquement les commentaires sécurisés et les espaces sans modifier les règles de style.
La réduction va-t-elle briser ma feuille de style ?
Rarement. CSS a une grammaire simple, donc la suppression des commentaires et des espaces est généralement sûre. Les exceptions sont les déclarations dans lesquelles un espace est significatif – valeurs de contenu, propriétés personnalisées et certaines notations fonctionnelles – alors vérifiez ces règles spécifiques après la réduction.
De combien mon CSS sera-t-il réduit ?
Généralement 10 à 30 %, selon la proportion d'indentations et de commentaires dans le fichier. Cela en vaut la peine, mais l'activation de gzip ou Brotli sur votre serveur permet d'économiser beaucoup plus, et les deux s'empilent.
Peut-il supprimer les CSS inutilisés ?
Non. La recherche de règles inutilisées nécessite d'analyser votre HTML et votre JavaScript, ce qu'un minificateur au niveau du texte ne peut pas faire. Utilisez un outil de purge connecté à votre build pour cela.
Outils associés
Formateur JSON
Formatez, validez et réduisez JSON instantanément
Encodeur et décodeur Base64
Encodez du texte ou des images en Base64 et décodez-les
Encodeur et décodeur d'entité HTML
Encoder les caractères spéciaux en entités HTML et inversement
Minificateur JavaScript JS
Compressez et réduisez le code JavaScript pour un chargement rapide