RUNWEBTOOLS
Deutsch

CSS-Formatierer

Unordentliches oder minifiziertes CSS im Browser verschönern und ordnen.

Live — formatiert beim Tippen

Beispiele

Minifiziertes CSS verschönern

Eingabe

.btn{color:#fff;background:#000;padding:8px 16px;}

Ausgabe

.btn {
  color: #fff;
  background: #000;
  padding: 8px 16px;
}

Uneinheitliche Abstände aufräumen

Eingabe

a{color:blue;}  a:hover{color:red;}

Ausgabe

a {
  color: blue;
}

a:hover {
  color: red;
}

Über dieses Tool

Dieser kostenlose Online-CSS-Formatter verwandelt unordentliche oder minifizierte Stylesheets in sauberes, ordentlich eingerücktes CSS — ein schnelles CSS-Beautifier- und Pretty-Print-Tool. Füge dein CSS ein, wähle einen Einrückungsstil, und das formatierte Ergebnis erscheint sofort. Alles läuft ohne Upload in deinem Browser, dein Code verlässt dein Gerät also nie.

So funktioniert's

  1. Füge dein CSS ins Eingabefeld ein (klicke auf Beispiel zum Ausprobieren).
  2. Wähle eine Einrückung von 2 Leerzeichen, 4 Leerzeichen oder einem Tab.
  3. Lies das verschönerte CSS im Ausgabefeld rechts.
  4. Kopiere das Ergebnis mit dem Kopieren-Button.

Wann man einen CSS-Formatter nutzt

Neuformatieren hilft, wenn du komprimiertes CSS aus einem gebauten Bundle kopierst, ein Stylesheet mit uneinheitlichen Abständen erbst oder eine Regel vor dem Bearbeiten lesen willst. Eine konsistente Einrückung macht Selektoren und Verschachtelung offensichtlich und hält Diffs sauber.

Häufig gestellte Fragen

Ist dieser CSS-Formatter kostenlos?

Ja — ein komplett kostenloser Online-CSS-Formatter und -Beautifier ohne Anmeldung und ohne Limits. Formatiere und rücke so viel CSS ein, wie du willst.

Wird mein CSS auf einen Server hochgeladen?

Nein. Dies ist ein Tool ohne Upload — dein CSS wird komplett in deinem Browser formatiert, der Code verlässt dein Gerät also nie. Sicher für private oder interne Stylesheets.

Was macht der CSS-Beautifier?

Er setzt jede Regel und Deklaration auf eine eigene Zeile, normalisiert Abstände um Klammern, Doppelpunkte und Semikolons und rückt alles neu ein, sodass minifiziertes oder unordentliches CSS lesbar wird.

Kann ich die Einrückung wählen?

Ja — wähle 2 Leerzeichen, 4 Leerzeichen oder Tabs. Deine Wahl wird im Browser für das nächste Mal gemerkt.

Funktioniert es mit SCSS oder Less?

Es verarbeitet die meiste SCSS- und Less-Syntax gut zum Einrücken und Aufräumen, da die Struktur CSS-ähnlich ist. Es formatiert, statt zu kompilieren — es expandiert keine Verschachtelungen oder Variablen.

Expandiert es minifiziertes CSS?

Ja. Füge ein einzeiliges oder minifiziertes Stylesheet ein, und es wird wieder in sauber eingerückte, lesbare Regeln expandiert.

Funktioniert es offline und auf dem Handy?

Nach dem Laden läuft es lokal, funktioniert also auch bei wackliger Verbindung, und das Layout ist auf Handys und Tablets voll responsiv.

Ähnliche Tools