Kategorie: Entwicklung

CSS-Formatierer

CSS lokal mit 2 oder 4 Leerzeichen Einrückung formatieren oder minifizieren

Füge CSS ein, um es mit 2 oder 4 Leerzeichen Einrückung schön auszugeben, oder minifiziere es auf die kleinste sichere Ausgabe. Kommentare bleiben beim Formatieren erhalten. Läuft komplett im Browser.

Im Browser formatiert.

Ursprüngliche Größe140 BErgebnisgröße159 B
Ergebnis
.tool-panel {
  display:grid;
  gap:16px;
  padding:16px
}
/* accent border */
.tool-panel .tool-output {
  border:1px solid var(--line);
  border-radius:8px
}

Alles auf dieser Seite wird in Ihrem Browser verarbeitet. Nichts wird hochgeladen.

Wozu dieses Werkzeug dient

Ein CSS-Formatierer rückt Regeln und Deklarationen neu ein, sodass verschachtelte Selektoren und Media Queries leicht zu erfassen sind, während ein Minifizierer Kommentare und unnötige Leerzeichen entfernt, um ein Stylesheet für die Produktion zu verkleinern. Dieses Werkzeug ordnet ausschließlich Leerraum neu an und wertet das CSS niemals aus oder führt es aus.

So funktioniert es

  1. Füge dein CSS in das Eingabefeld ein oder lade das Beispiel.
  2. Wähle „Formatieren“ für lesbare Ausgabe oder „Minifizieren“ für die kleinste Größe.
  3. Kopiere das Ergebnis; bei formatierter Ausgabe kannst du zusätzlich 2 oder 4 Leerzeichen Einrückung wählen.

Datenschutz

Dieses Werkzeug läuft vollständig in Ihrem Browser. Ihre Eingabe wird nie hochgeladen, gespeichert oder weitergegeben – beim Schließen des Tabs ist sie weg.

Häufig gestellte Fragen

Wird mein CSS irgendwohin hochgeladen?
Nein. Das Formatieren und Minifizieren erfolgt durch JavaScript in der Seite, sodass dein Stylesheet dein Gerät nie verlässt.
Bleiben Kommentare erhalten?
Formatierte Ausgabe behält Kommentare in eigenen Zeilen; minifizierte Ausgabe entfernt sie, wie es die meisten Produktions-Build-Tools ebenfalls tun.
Wird das CSS validiert?
Nein. Es wird nur Leerraum und Einrückung neu geordnet, sodass Tippfehler bei Eigenschaftsnamen oder ungültige Werte nicht erkannt werden.