Modular Scale Functions

SassMeister-input.scss

// ----
// libsass (v3.2.5)
// ----

// Validated against http://www.modularscale.com/
// http://www.modularscale.com/?1&&1.5&web&text
$mod-scale--size: 1rem !default;
$mod-scale--ratio: 1.5 !default;

@function modular-scale($increment, $base-size, $ratio) {
  // Either increase (increment > 0) or decrease 
  // (increment >= 0) $base-size by $ratio through 
  // the given number of $increment units.
  @for $i from 1 through $increment {
    @if $increment > 0 {
      $base-size: $base-size * $ratio;    
    } @else {
      $base-size: $base-size / $ratio;
    }
  }

  @return $base-size;
}

@for $i from 1 through 6 {
  h#{$i} {
    font-size: modular-scale(7 - $i, $mod-scale--size, $mod-scale--ratio);
  }
}

p {
  font-size: modular-scale(0, $mod-scale--size, $mod-scale--ratio);
}

small {
  font-size: modular-scale(-1, $mod-scale--size, $mod-scale--ratio);
}

.font-size--teeny {
  font-size: modular-scale(-4, $mod-scale--size, $mod-scale--ratio);
}

SassMeister-output.css

h1 {
  font-size: 11.39062rem;
}

h2 {
  font-size: 7.59375rem;
}

h3 {
  font-size: 5.0625rem;
}

h4 {
  font-size: 3.375rem;
}

h5 {
  font-size: 2.25rem;
}

h6 {
  font-size: 1.5rem;
}

p {
  font-size: 0.44444rem;
}

small {
  font-size: 0.2963rem;
}

.font-size--teeny {
  font-size: 0.08779rem;
}