Zur Startseite

CSS-Minifier

Fuege CSS ein, entferne unnoetige Kommentare und Abstaende, kuerze HEX-Farben und bereinige Null-Einheiten.

Coding Warte auf Ergebnis
Problem melden

CodingNur Browser

Uebersicht

Kleineres CSS kann Renderstart und Cache verbessern. In Produktion wichtige Layouts im Browser pruefen.

CSS-Struktur pruefen

CSS-Struktur wirkt gueltig

Originalgroesse

310 B

Minify-Groesse

227 B

Bytes gespart

83 B

Ersparnis

26,8%

Gzip Schaetzung

73 B

Regeln

2

Deklarationen

10

Kommentare entfernt

1

Quell-CSS

CSS zum Verkleinern einfuegen. Media Queries und CSS-Variablen sind moeglich.

Minifiziertes Ergebnis

Pruefe das CSS, kopiere es oder lade .min.css herunter.

. product-card{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;padding:20px;border:1px solid #eee;border-radius:12px;background:#fff;color:#1f2937}.product-card:hover{border-color:#fc0;transform:translateY(-2px)}

Checkliste vor Deployment

  • Lizenzkommentare erhalten, wenn erforderlich.
  • SCSS, Less oder CSS-in-JS zuerst kompilieren.
  • Hover, Media Queries und calc() nach Minify pruefen.

Hinweis zum einfachen Minifier

Dieses Tool dient schneller Reduktion. Fuer komplexes CSS auch die Build-Pipeline nutzen.

Minifiziertes CSS pruefen

Wenn Sie die Werte oben aendern, werden die Ergebnisse sofort aktualisiert. Pruefen Sie vor wichtigen Entscheidungen bitte auch die Hinweise und FAQ unten.

Nutzungshinweise

  • Normale Kommentare werden entfernt, /*! ... */ kann erhalten bleiben.
  • Leerraum um Klammern, Doppelpunkte, Semikolons und Kommas wird reduziert.
  • Ersparnis = (Originalgroesse - Minify-Groesse) / Originalgroesse x 100.

Haeufige Fragen

Wann sollte ich dieses Werkzeug verwenden?expand_more

Nutzen Sie es als schnelle Referenz fuer haeufige Berechnungen oder Umrechnungen, die Sie wiederholt pruefen moechten.

Weiter entdecken

Weitere Tools fuer den naechsten Schritt

Wechsle zu aehnlichen Tools derselben Kategorie und zu beliebten Gogotem-Tools.

Alle Tools ansehen arrow_forward