Plak je CSS in het invoervak. Klik op Minify om opmerkingen en extra witruimte te verwijderen voor een kleiner bestand, of Beautify om geminificeerde CSS te formatteren met duidelijke inspringing. Het resultaat wordt hieronder getoond met tekenaantallen; je kunt het kopiëren voor gebruik in je project. Alle verwerking draait in je browser.
Resultaat verschijnt hier na minify of beautify.
Over CSS-minifier / -beautifier
CSS minifyen betekent opmerkingen, extra spaties en regeleinden verwijderen zodat het bestand kleiner is en sneller laadt — zonder te veranderen hoe de browser stijlen toepast. Beautifyen doet het tegenovergestelde: het neemt geminificeerde of rommelige CSS en herformatteert het met duidelijke inspringing en regeleinden zodat je het kunt lezen en bewerken. Beide draaien in je browser zodat je code je apparaat nooit verlaat.
Hoe te gebruiken
- Plak je CSS in het vak CSS-invoer (bijv. kopieer van je stylesheet of van de browser dev tools).
- Klik op Minify voor een éénregelige, opmerkingvrije versie en zie hoeveel de grootte is verminderd; of klik op Beautify voor een geformatteerde, leesbare versie.
- Gebruik Uitvoer kopiëren om het resultaat te kopiëren, plak het daarna in je project of build-pipeline. Wissen reset beide vakken.
Wanneer te gebruiken
- CSS-bestandsgrootte verkleinen voor productie om laadtijd te verbeteren
- Geminificeerde of gekopieerde CSS weer leesbaar maken voor debugging of bewerken
- Snel eenmalige minificatie zonder een buildtool in te stellen
- Controleren hoe veel kleiner je CSS kan worden na het verwijderen van opmerkingen en witruimte
Details
Minify verwijdert /* ... */-opmerkingen en vouwt witruimte samen; het resultaat is geldige CSS. Beautify voegt inspringing toe na {, ; en regeleinden. Voor geavanceerde optimalisaties (bijv. properties verkorten, ongebruikte regels verwijderen) gebruik een dedicated buildtool zoals PostCSS met cssnano.