SCSS Beautifier/Minifier

Input:

$primary-color: #333;body {  font-family: Arial, sans-serif;  h1 {    color: $primary-color;    font-size: 24px;  }  p {    line-height: 1.6;    color: lighten($primary-color, 20%);  }}

$primary-color: #333;body {  font-family: Arial, sans-serif;  h1 {    color: $primary-color;    font-size: 24px;  }  p {    line-height: 1.6;    color: lighten($primary-color, 20%);  }}

Output:

Indentation:

Minify:

SCSS Beautifier/Minifier

This tool allows you to format and beautify SCSS code, or minify it. It provides a live preview of the formatted code and allows you to adjust the indentation level or switch to minification mode.

Features:

Format and beautify code
Minify code
Adjust indentation level (when not minifying)
Preview the formatted code in real-time
Copy the formatted code to your clipboard
Clear both input and output fields