CSS minifizieren und formatieren

Fügen Sie Ihr Stylesheet ein und klicken Sie auf „Minifizieren“, um überflüssige Kommentare, Leerzeichen und Zeilenumbrüche zu entfernen, oder auf „Formatieren“, um komprimiertes CSS in lesbaren, sauber eingerückten Code zu verwandeln. Alles geschieht in Ihrem Browser.

Was macht der Minifizierer?

Er entfernt alles, was der Browser nicht braucht: Kommentare, Einrückungen, Zeilenumbrüche, Leerzeichen um geschweifte Klammern, Doppelpunkte, Kommas und Kombinatoren sowie das letzte Semikolon jedes Blocks. Das Ergebnis ist in der Regel 15 bis 30 % kleiner und funktioniert genau gleich.

Was nicht angetastet werden darf, bleibt erhalten: der Inhalt von Zeichenketten (content: "…"), Pfade in url(), die notwendigen Leerzeichen in calc() und Media Queries sowie Kommentare, die mit /*! beginnen – sie enthalten üblicherweise Lizenzhinweise und müssen erhalten bleiben.

Minifizieren im Produktivbetrieb

Weniger Bytes bedeuten schnellere Downloads und bessere Core Web Vitals, vor allem auf Mobilgeräten. Aktivieren Sie zusätzlich die Kompression mit gzip oder Brotli auf dem Server, die CSS noch deutlich stärker verkleinert, und liefern Sie die Dateien mit langer Cache-Dauer aus.

In Projekten mit Build-Schritt (Vite, webpack, PostCSS …) erledigen cssnano oder Lightning CSS das Minifizieren automatisch; dieses Tool eignet sich für einfache Websites, Vorlagen oder um das minifizierte CSS einer anderen Seite lesbar zu machen.