SCSS to SASS Converter
Convert SCSS syntax to SASS — variables, nesting and structure translated in one step.
Input
Output
Ready
Drop a file to load it
About this tool
Translate SCSS into SASS. SCSS uses the brace syntax of Sass, with `$` variables; SASS uses the original indented Sass syntax — no braces, no semicolons. The converter rewrites the syntax — variable sigils, braces and separators — while keeping your rules and nesting intact.
When you would use it
- Migrating a project from SCSS to SASS
- Reusing a SCSS snippet in a SASS codebase
- Seeing how a SCSS file looks in SASS syntax
Worked example
$c: red;
.card {
color: $c;
}
$c: red .card color: $c
Things worth knowing
- This is a syntax translation, not a compiler. Variables, nesting, comments and structure carry across.
- Mixins, functions and control directives (
@if,@each, loops) are preserved verbatim rather than evaluated, because their semantics differ between dialects. - SASS is indentation-based, so braces and semicolons are removed and nesting is expressed by indentation.
Questions
Frequently asked
Will my mixins be converted?
Mixin and function bodies are preserved as written. Their syntax differs meaningfully between dialects, so translating them automatically would risk producing something that looks right but behaves differently. Review those by hand.
Is the output ready to compile?
For plain rules, variables and nesting, yes. If your source uses dialect-specific features, check those sections after converting.
Is my data uploaded anywhere?
No. Every tool on JSONWorks runs entirely in your browser using JavaScript. Your input is never sent to a server, never logged and never stored. The simplest proof is to disconnect from the internet — the tools keep working. The site does load Google Fonts and a Google Analytics page-view tag, so you will see those two requests in your network tab, but neither receives anything you type or paste.
Related