Generated by SassMeister.com.

SassMeister-input-HTML.haml

.standard
  %ul
    %li.xsmall
      xsmall 12px
    %li.small
      small 14px
    %li
      medium 16px
    %li.large
      large 18px
    %li.xlarge
      xlarge 20px
    %li.xxlarge
      xxlarge 24px
    %li.xxxlarge
      xxxlarge 28px
    %li.xxxxlarge
      xxxxlarge 32px
    %li.xxxxxlarge
      xxxxxlarge 36px
    
.ms
  %ul
    %li.xsmall
      xsmall 12px
    %li.small
      small 14px
    %li
      medium 16px
    %li.large
      large 18px
    %li.xlarge
      xlarge 20px
    %li.xxlarge
      xxlarge 24px
    %li.xxxlarge
      xxxlarge 28px
    %li.xxxxlarge
      xxxxlarge 32px
    %li.xxxxxlarge
      xxxxxlarge 36px
    

SassMeister-input.sass

// ----
// libsass (v3.2.4)
// ----

@import "bourbon/bourbon"

html
  font-size: 16px

.standard, .ms
  width: 30%
  float: left

.standard
  margin-left: 30%

.ms
  margin-left: -30%
  color: orange

.standard
  width: 30%
  float: left
  .xsmall
    font-size: 12px
  .small
    font-size: 14px
  .large
    font-size: 18px
  .xlarge
    font-size: 20px
  .xxlarge
    font-size: 24px
  .xxxlarge
    font-size: 28px
  .xxxxlarge
    font-size: 32px
  .xxxxxlarge
    font-size: 36px
    
$modular-scale-ratio: $major-second

.ms
  .xsmall
    font-size: modular-scale(-2)
  .small
    font-size: modular-scale(-1)
  .large
    font-size: modular-scale(1)
  .xlarge
    font-size: modular-scale(2)
  .xxlarge
    font-size: modular-scale(3)
  .xxxlarge
    font-size: modular-scale(5)
  .xxxxlarge
    font-size: modular-scale(6)
  .xxxxxlarge
    font-size: modular-scale(7)

SassMeister-output.css

html { font-size: 16px; }

.standard, .ms { width: 30%; float: left; }

.standard { margin-left: 30%; }

.ms { margin-left: -30%; color: orange; }

.standard { width: 30%; float: left; }

.standard .xsmall { font-size: 12px; }

.standard .small { font-size: 14px; }

.standard .large { font-size: 18px; }

.standard .xlarge { font-size: 20px; }

.standard .xxlarge { font-size: 24px; }

.standard .xxxlarge { font-size: 28px; }

.standard .xxxxlarge { font-size: 32px; }

.standard .xxxxxlarge { font-size: 36px; }

.ms .xsmall { font-size: 0.79012em; }

.ms .small { font-size: 0.88889em; }

.ms .large { font-size: 1.125em; }

.ms .xlarge { font-size: 1.26562em; }

.ms .xxlarge { font-size: 1.42383em; }

.ms .xxxlarge { font-size: 1.80203em; }

.ms .xxxxlarge { font-size: 2.02729em; }

.ms .xxxxxlarge { font-size: 2.2807em; }

SassMeister-rendered.html

<div class='standard'>
  <ul>
    <li class='xsmall'>
      xsmall 12px
    </li>
    <li class='small'>
      small 14px
    </li>
    <li>
      medium 16px
    </li>
    <li class='large'>
      large 18px
    </li>
    <li class='xlarge'>
      xlarge 20px
    </li>
    <li class='xxlarge'>
      xxlarge 24px
    </li>
    <li class='xxxlarge'>
      xxxlarge 28px
    </li>
    <li class='xxxxlarge'>
      xxxxlarge 32px
    </li>
    <li class='xxxxxlarge'>
      xxxxxlarge 36px
    </li>
  </ul>
</div>
<div class='ms'>
  <ul>
    <li class='xsmall'>
      xsmall 12px
    </li>
    <li class='small'>
      small 14px
    </li>
    <li>
      medium 16px
    </li>
    <li class='large'>
      large 18px
    </li>
    <li class='xlarge'>
      xlarge 20px
    </li>
    <li class='xxlarge'>
      xxlarge 24px
    </li>
    <li class='xxxlarge'>
      xxxlarge 28px
    </li>
    <li class='xxxxlarge'>
      xxxxlarge 32px
    </li>
    <li class='xxxxxlarge'>
      xxxxxlarge 36px
    </li>
  </ul>
</div>