Format CSS in the Browser

Format Your CSS

Input your css into the text field below and it will be formatted to use 2-space indent.

Output:

This tool uses prettier.format() to format CSS. format() takes 2 parameters:

1. text, which is what you input into the textbox
2. options, which indicates specific format preferences like tab width and end of line characters.

Here's the code we use to format the CSS:

let initial = prettier.format(text, {
  parser: 'css',
  plugins: prettierPlugins,
  tabWidth: 2,
  endOfLine: 'auto'
});

We import Prettier from unpkg as follows:

<script src="https://unpkg.com/prettier@2.7.1/standalone.js"></script>
<script src="https://unpkg.com/prettier@2.7.1/parser-postcss.js"></script>

---

More Tools

• Convert Callbacks to Async/Await with OpenAI
• Lodash Playground
• Convert JSON to YAML
• Convert Binary to Decimal