CSS Minifier

Q: Werden moderne CSS-Features wie Custom Properties, Nesting und @layer unterstützt?

Ja. Custom Properties (--var), @media, @supports, @layer, @container und Grid-Syntax bleiben erhalten.

Füge ein Stylesheet ein, um Leerraum und Kommentare zu entfernen, Werte wie #ff0000 → red zu kürzen und doppelte Regeln mit den strukturellen Optimierungen von CSSO zusammenzuführen.

Läuft im BrowserOhne AnmeldungKein Upload

Eingabe

Datei öffnen

Minifizierte Ausgabe

Anleitung: CSS Minifier

Füge CSS ein oder öffne eine .css-Datei.
Lass Restrukturieren aktiviert, um Regeln und Deklarationen zusammenzuführen, oder deaktiviere es für einen sicheren Durchgang, der nur Leerraum entfernt.
Lass Lizenzkommentare behalten aktiviert, um /*! … */-Hinweise zu erhalten.
Vergleiche die Original-, Minified- und Gzip-Größe.
Kopiere das Ergebnis oder lade output.min.css herunter.

So funktioniert CSS-Minifizierung

Dieses Tool verwendet CSSO (CSS Optimizer), das dein Stylesheet in einen Syntaxbaum parst und in der kürzesten gleichwertigen Form wieder ausgibt. Neben dem Entfernen von Leerraum und Kommentaren werden sichere Wertumformungen angewendet:

#ffffff → #fff, #ff0000 → red
0px → 0, 0.90 → .9
margin: 8px 16px 8px 16px → margin:8px 16px
Leere Regeln und doppelte Deklarationen werden entfernt

Was macht „Restrukturieren“?

Die Restrukturierung betrachtet das gesamte Stylesheet: Regeln mit identischen Deklarationen werden zu einer Selektorliste zusammengeführt (.a,.b{color:red}), und wiederholte Selektoren werden kombiniert. Das spart bei echten Stylesheets oft weitere 5–15 %. CSSO führt nur zusammen, wenn die Kaskadenreihenfolge gleich bleibt. Wenn du dich aber auf ungewöhnliche Überschreibungen verlässt, kannst du die Option für eine rein syntaktische Minifizierung abschalten.

Warum CSS minifizieren?

CSS blockiert das Rendering: Der Browser kann die Seite erst darstellen, wenn die Stylesheets im <head> heruntergeladen und geparst sind. Kleineres CSS bedeutet einen schnelleren First Contentful Paint und bessere Core Web Vitals, was Nutzern und Suchrankings gleichermaßen hilft. Kombiniere die Minifizierung für das beste Ergebnis mit gzip oder Brotli auf dem Server.

Häufig gestellte Fragen

Ist es sicher, CSS zu minifizieren?

Ja. Leerraum und Kommentare haben keinen Einfluss darauf, wie CSS gerendert wird, und die Wertumformungen von CSSO sind laut Spezifikation gleichwertig. Die Restrukturierung erhält die Kaskadenreihenfolge; deaktiviere sie, wenn du die konservativste Ausgabe willst.

Werden moderne CSS-Features wie Custom Properties, Nesting und @layer unterstützt?

Ja. Custom Properties (--var), @media, @supports, @layer, @container und Grid-Syntax bleiben erhalten.

Kann ich minifiziertes CSS später wieder lesbar machen?

Minifiziertes CSS lässt sich mit jedem Formatter neu einrücken, entfernte Kommentare sind aber verloren. Behalte deine Originaldatei und betrachte die minifizierte Datei als Build-Ergebnis.

Wird mein Stylesheet irgendwohin hochgeladen?

Nein. Die Minifizierung läuft in deinem Browser; nichts wird an einen Server gesendet.