Zum Inhalt springen
HandfulTools

CSS formatieren und minifizieren

Klapp minifiziertes CSS in eine Deklaration pro Zeile auf, um es zu lesen oder zu debuggen, oder minifiziere dein Stylesheet, um seine Größe für die Produktion zu verringern.

Läuft im Browser

Loading…

So geht's

  1. Füge dein CSS ein.
  2. Wähle Formatieren oder Minifizieren.
  3. Kopiere das Ergebnis.

Wie es funktioniert

Das Stylesheet wird tokenisiert, sodass Zeichenketten in Anführungszeichen (etwa content: "a;b") und Kommentare nie verändert werden. Beim Formatieren stehen Selektor, Deklaration und schließende Klammer jeweils in einer eigenen Zeile mit einheitlicher Einrückung, auch bei verschachtelten Regeln innerhalb von @media.

Beim Minifizieren entfallen Kommentare (außer /*! Lizenzkommentaren), Leerraum und das letzte Semikolon jedes Blocks. Leerzeichen, die die Bedeutung verändern, etwa rund um + und - in calc(), bleiben erhalten.

Beispiele

Minifiziertes Framework
.a{color:red}.b:hover{color:blue} wird zu zwei lesbaren Regeln mit eingerückten Deklarationen.

Typische Anwendungsfälle

  • Fremdes oder minifiziertes CSS lesen
  • Die Größe eines Stylesheets verringern
  • CSS vor dem Code-Review vereinheitlichen

Datenschutz und Sicherheit

Dieses Tool läuft vollständig in deinem Browser. Deine Dateien und Texte werden nie auf unsere Server hochgeladen — die Verarbeitung passiert auf deinem Gerät, und auch das Ergebnis entsteht dort. Wie jedes Tool mit Dateien umgeht

Häufige Fragen

Ersetzt das ein Build-Tool?

Für Produktivsysteme optimieren Build-Tools wie Lightning CSS oder cssnano deutlich tiefer. Dieses Tool ist ideal für schnelle Einzelfälle.

Werden SCSS oder Less unterstützt?

Einfache Verschachtelung wird korrekt formatiert, für präprozessorspezifische Syntax wie Mixins gibt es aber keine Garantie.

Zuletzt aktualisiert: