Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

// SCSS version of Joshua's baseline generator - [http://joshnh.com/tools/em-baseline-generator.html]
// Article - http://joshnh.com/2011/08/03/how-to-set-up-a-baseline-grid/

$base-font-size: 16px !default;
$line-height: 24px !default;
$unit: em !default;

$custom-classes: "alpha", "beta", "gamma", "delta", "epsilon", "zeta";
$modular-scale: 48px, 36px, 24px, 21px, 18px, 16px;
$magic-number: 48px, 48px, 24px, 24px, 24px, 24px;

@function calc-font-size($scale){
  @return ($scale/$base-font-size)#{$unit};
}

@function calc-line-height($num, $scale){
  @return ($num/$scale);
}

@function calc-margin($scale){
  @return ($line-height/$scale)#{$unit};
}

html {
  font-size: 100%;
}

%hN { 
  font-weight: bold;
  margin: 0;
}

@for $i from 1 through length($custom-classes) {
  h#{$i}, .#{nth($custom-classes, $i)} {
    @extend %hN;
    
    $scale: nth($modular-scale, $i);
    $num: nth($magic-number, $i);
    
    font-size: calc-font-size($scale);
    line-height: calc-line-height($num, $scale);
    margin-bottom: calc-margin($scale);
  }    
}

p,
blockquote {
  font-size: calc-font-size($base-font-size);
  line-height: calc-line-height($line-height, $base-font-size);
  margin: 0 0 ($line-height/$base-font-size)#{$unit};
  
  -webkit-hyphens: auto;
     -moz-hyphens: auto;
      -ms-hyphens: auto;
          hyphens: auto;
}

dl,
ol,
ul {
  font-size: calc-font-size($base-font-size);
  margin: 0 0 ($line-height/$base-font-size)#{$unit};
  padding: 0;
}

dd,
dt,
li {
  line-height: calc-line-height($line-height, $base-font-size);
  margin: 0;
}

SassMeister-output.css

html {
  font-size: 100%;
}

h1, .alpha, h2, .beta, h3, .gamma, h4, .delta, h5, .epsilon, h6, .zeta {
  font-weight: bold;
  margin: 0;
}

h1, .alpha {
  font-size: 3em;
  line-height: 1;
  margin-bottom: 0.5em;
}

h2, .beta {
  font-size: 2.25em;
  line-height: 1.33333;
  margin-bottom: 0.66667em;
}

h3, .gamma {
  font-size: 1.5em;
  line-height: 1;
  margin-bottom: 1em;
}

h4, .delta {
  font-size: 1.3125em;
  line-height: 1.14286;
  margin-bottom: 1.14286em;
}

h5, .epsilon {
  font-size: 1.125em;
  line-height: 1.33333;
  margin-bottom: 1.33333em;
}

h6, .zeta {
  font-size: 1em;
  line-height: 1.5;
  margin-bottom: 1.5em;
}

p,
blockquote {
  font-size: 1em;
  line-height: 1.5;
  margin: 0 0 1.5em;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

dl,
ol,
ul {
  font-size: 1em;
  margin: 0 0 1.5em;
  padding: 0;
}

dd,
dt,
li {
  line-height: 1.5;
  margin: 0;
}