SASS to CSS Converter

Someone sent you a chunk of .sass, the dialect with no braces and no semicolons, and your project uses .scss or plain CSS. The conversion is pure reformatting, but doing thirty lines by hand gives you exactly what you would expect: one missing semicolon and one stray brace, discovered when the build fails. Paste the indented block and take the braced version from the other side.

Parsing is driven by indentation. A line starting at column zero is treated as a selector and opens a block; an indented line is treated as a declaration and split at the first colon, becoming property and value with a semicolon appended. This is syntax reformatting, not compilation: nothing is resolved, nothing is computed. The note under the field states the limit out loud, flat rules only, and it is worth taking literally.

Nesting does not work here. An indented line using the parent reference ampersand is read as if it were a declaration and comes out mangled, and its children get flattened into the block above. A dollar variable at column zero is also read as a selector. Use it on flat blocks, for reading and quick conversion. If the file has nesting, mixins or includes, run the official Sass compiler instead. There is a copy button, and everything happens in your browser.