A stylesheet written for people has comments, spaces and line breaks the browser does not need. Minifying removes them and shortens values such as 0px to 0 and #ffffff to #fff.
Beautify does the reverse for a stylesheet that arrived as one long line. The byte count before and after shows what was saved.
How to use the CSS Minifier and Beautifier tool
- Paste the CSS or open a file.
- Choose Minify or Beautify and whether to keep comments.
- Copy the stylesheet or download it.
Popular uses
- Faster-loading stylesheets for a website
- Reading and debugging a minified theme
- Inline critical CSS in a page head
Tips for the best result
- Keep comments ticked if the file starts with a license notice you must retain.
- Edit the readable file and minify as the last step before upload.
Quick facts
| Price | Free |
|---|---|
| Works with | CSS |
| Where it runs | In your browser, on your device |
| Account | Not needed |