Source Format
SCSS Less Sass (Indented) Stylus
Swap
Target Format
SCSS Less Sass (Indented) Stylus
Source Code
$primary-color: #3498db; $font-stack: Helvetica, Arial, sans-serif; $border-radius: 4px; @mixin border-radius($radius) { -webkit-border-radius: $radius; -moz-border-radius: $radius; border-radius: $radius; } @mixin flex-center { display: flex; justify-content: center; align-items: center; } body { font: 100% $font-stack; color: $primary-color; } .container { @include flex-center; max-width: 1200px; margin: 0 auto; .header { @include border-radius($border-radius); background-color: darken($primary-color, 10%); padding: 20px; h1 { font-size: 2em; color: white; } } .content { @extend .clearfix; padding: #{$border-radius * 2}; } }

Convert Reset Settings

Converted Output

Copy Output