Verändert dieses CSS-Tool das Programmverhalten?

Es ändert nur Layout oder entfernbare Leerzeichen. Bei ungewöhnlicher Syntax die Ausgabe vor dem Produktionseinsatz prüfen.

Wird mein Code hochgeladen?

Die Verarbeitung erfolgt lokal; dein Code wird nicht hochgeladen.

CSS-Formatierer

CSS-Code direkt im Browser sauber und lesbar formatieren und einrücken.

Dieses Tool läuft vollständig in deinem Browser. Deine Dateien werden niemals auf einen Server hochgeladen.

body {
  color:#222;
  margin:0
}
a {
  color:blue
}

Was dieser Formatierer macht

Ordnet CSS-ähnlichen Text mit Zeilenumbrüchen nach öffnenden und schließenden Klammern sowie Semikolons und rückt jede Klammerstufe mit zwei Leerzeichen ein. Die Ausgabe kann direkt kopiert werden.

Anwendung

Füge CSS in den Editor ein; das formatierte Ergebnis wird sofort aktualisiert. Kopiere es anschließend oder leere den Editor mit Reset. Reset stellt das ursprüngliche Beispiel nicht wieder her.

Formatierungsverhalten

Außerhalb von Zeichenketten und Kommentaren werden Leerraumfolgen reduziert und Deklarationen nach Semikolons getrennt. Inhalte in Anführungszeichen, Escape-Zeichen, Blockkommentare und erkannte //-Zeilenkommentare bleiben erhalten; Klammern steuern die Einrückungstiefe.

Wichtige Parser-Grenze

Das Tool arbeitet zeichenbasiert und ist kein CSS-Parser, Validator, Linter oder Standardtest. Es vereinheitlicht keine Abstände um Doppelpunkte, sortiert keine Eigenschaften, erweitert keine Kurzformen, ergänzt keine Satzzeichen und meldet weder unpassende Klammern noch ungültige Deklarationen.

Sicher prüfen

Fehlerhafte Eingaben, ungewöhnliche Escape-Folgen, Daten-URLs, spezielle Syntax oder nicht standardisierte Kommentare können überraschend formatiert werden. Prüfe und teste die kopierte Datei vor dem Produktionseinsatz und bewahre das Original auf.

Beispiel

Beim Einfügen von `.card{color:red;padding:8px 12px}a:hover{color:blue}` entstehen zwei Blöcke; jede Deklaration und jeder Selektor steht in einer eigenen Zeile mit zwei Leerzeichen Einrückung innerhalb der Klammern — `color: red;` und `padding: 8px 12px;` landen z. B. als getrennte eingerückte Zeilen unter `.card {`.

Datenschutz

Die Verarbeitung läuft lokal im Browser; eingefügtes CSS wird von diesem Tool nicht hochgeladen.

Häufig gestellte Fragen

Was macht der CSS-Formatierer?: CSS-Code direkt im Browser sauber und lesbar formatieren und einrücken.
Verändert dieses CSS-Tool das Programmverhalten?: Es ändert nur Layout oder entfernbare Leerzeichen. Bei ungewöhnlicher Syntax die Ausgabe vor dem Produktionseinsatz prüfen.
Wird mein Code hochgeladen?: Die Verarbeitung erfolgt lokal; dein Code wird nicht hochgeladen.

HTML-Minifizierer

HTML durch Entfernen unnötiger Leerzeichen und Kommentare verkleinern.

CSS-Minifizierer

CSS durch Entfernen unnötiger Leerzeichen und Kommentare verkleinern.

YAML-Formatierer

Formatieren Sie YAML-Dokumente sofort in Ihrem Browser.

GraphQL-Formatierer

GraphQL-Code direkt im Browser sauber und lesbar formatieren und einrücken.

HTML-Formatierer

HTML-Code direkt im Browser sauber und lesbar formatieren und einrücken.

JavaScript-Formatierer

JavaScript-Code direkt im Browser sauber und lesbar formatieren und einrücken.