CSS Minifier

Indsæt et stylesheet for at fjerne mellemrum og kommentarer, forkorte værdier som #ff0000 → red og flette dublerede regler med CSSO's strukturelle optimeringer.

Kører i din browserIngen tilmeldingIntet uploades

Minificeret resultat

Sådan bruger du CSS Minifier

  1. Indsæt CSS, eller åbn en .css-fil.
  2. Lad Omstrukturér være slået til for at flette regler og deklarationer, eller slå det fra for en sikker gennemgang, der kun fjerner mellemrum.
  3. Lad Bevar licenskommentarer være slået til for at bevare /*! … */-noter.
  4. Sammenlign original, minificeret og gzippet størrelse.
  5. Kopiér resultatet, eller download output.min.css.

Sådan fungerer CSS-minificering

Værktøjet bruger CSSO (CSS Optimizer), som parser dit stylesheet til et syntakstræ og skriver det ud igen i den korteste ækvivalente form. Ud over at fjerne mellemrum og kommentarer foretager den sikre omskrivninger af værdier:

  • #ffffff → #fff, #ff0000 → red
  • 0px → 0, 0.90 → .9
  • margin: 8px 16px 8px 16px → margin:8px 16px
  • Tomme regler og dublerede deklarationer fjernes

Hvad gør “omstrukturér”?

Omstrukturering ser på hele stylesheetet: regler med identiske deklarationer flettes til én selektorliste (.a,.b{color:red}), og gentagne selektorer kombineres. Det sparer ofte yderligere 5–15 % på rigtige stylesheets. CSSO fletter kun, når kaskaderækkefølgen forbliver den samme, men hvis du er afhængig af usædvanlige overskrivninger, kan du slå det fra og få en rent syntaktisk minificering.

Hvorfor minificere CSS?

CSS blokerer rendering: browseren kan ikke tegne siden, før stylesheets i <head> er downloadet og parset. Mindre CSS giver en hurtigere First Contentful Paint og bedre Core Web Vitals, hvilket hjælper både brugere og placeringer i søgemaskiner. Kombinér minificering med gzip eller Brotli på serveren for det bedste resultat.

Ofte stillede spørgsmål

Er det sikkert at minificere CSS?
Ja. Mellemrum og kommentarer har ingen effekt på, hvordan CSS gengives, og CSSO's omskrivninger af værdier er ækvivalente ifølge specifikationen. Omstrukturering bevarer kaskaderækkefølgen; slå det fra, hvis du vil have det mest konservative output.
Understøttes moderne CSS som custom properties, nesting og @layer?
Ja. Custom properties (--var), @media, @supports, @layer, @container og grid-syntaks bevares.
Kan jeg af-minificere CSS senere?
Minificeret CSS kan indrykkes igen af enhver formatter, men fjernede kommentarer kan ikke gendannes. Behold din originale kildefil, og betragt den minificerede fil som et build-output.
Bliver mit stylesheet uploadet nogen steder?
Nej. Minificeringen kører i din browser; intet sendes til en server.

Relaterede værktøjer

JavaScript Minifier Komprimér og forkort JS med Terser, med størrelse og gzip-tal. HTML Minifier Fjern kommentarer og mellemrum, og minificér inline CSS/JS. SQL Formatter Formatér eller minificér SQL til PostgreSQL, MySQL, T-SQL, BigQuery m.fl. JSON Formatter Formatér, minificér og validér JSON med fejl pr. linje/kolonne.