Generated by SassMeister.com.

SassMeister-input-HTML.html

<p>lorem ipsum dolor sit amet</p>
<p class="h6">lorem ipsum dolor sit amet</p>
<p class="h5">lorem ipsum dolor sit amet</p>
<p class="h4">lorem ipsum dolor sit amet</p>
<p class="h3">lorem ipsum dolor sit amet</p>
<p class="h2">lorem ipsum dolor sit amet</p>
<p class="h1">lorem ipsum dolor sit amet</p>

SassMeister-input.scss

// ----
// Sass (v3.4.4)
// Compass (v1.0.1)
// SassySort (v0.0.1)
// ----

$bfs: 16px;

$phi: 	            1/1.618;
$golden: 	          1/1.618;
$double-octave: 	  1/4;
$major-twelfth: 	  1/3;
$major-eleventh: 	  3/8;
$major-tenth: 	    2/5;
$octave: 	          1/2;
$major-seventh: 	  8/15;
$minor-seventh: 	  9/16;
$major-sixth: 	    3/5;
$minor-sixth: 	    5/8;
$fifth: 	          2/3;
$augmented-fourth:  1/1.4142135; // √2
$fourth: 	          3/4;
$major-third: 	    4/5;
$minor-third: 	    5/6;
$major-second: 	    8/9;
$minor-second: 	   15/16;

$ratio: $golden;

$levels: 8;
$scale1: 12px;
$scale2: 14px;

@while length($scale1) + length($scale2) < $levels
{
  $next1: nth($scale1, length($scale1)) / $ratio;
  $next2: nth($scale2, length($scale2)) / $ratio;
  
  // on s'assure que le nombre ne soit pas déjà existant ni dans une liste ni dans l'autre
  @if index($scale1, $next1) == null and index($scale2, $next1) == null
  {
    $scale1: join($scale1, $next1);
  }
  @if index($scale1, $next2) == null and index($scale2, $next2) == null
  {
    $scale2: join($scale2, $next2);
  }
}

@import 'SassySort';

$scale: sort(join($scale1, $scale2));

@function em($px, $contexte: $bfs)
{
    @return($px / $contexte * 1em);
}

@mixin level($level, $contexte: $bfs)
{
  font-size: em(nth($scale, $levels - $level + 1), $contexte);
}

body
{
  @include level(7);
}
.h1
{
  @include level(1);
}
.h2
{
  @include level(2);
}
.h3
{
  @include level(3);
}
.h4
{
  @include level(4);
}
.h5
{
  @include level(5);
}
.h6
{
  @include level(6);
}

SassMeister-output.css

body {
  font-size: 0.875em;
}

.h1 {
  font-size: 3.70633em;
}

.h2 {
  font-size: 3.17685em;
}

.h3 {
  font-size: 2.29068em;
}

.h4 {
  font-size: 1.96344em;
}

.h5 {
  font-size: 1.41575em;
}

.h6 {
  font-size: 1.2135em;
}

SassMeister-rendered.html

<p>lorem ipsum dolor sit amet</p>
<p class="h6">lorem ipsum dolor sit amet</p>
<p class="h5">lorem ipsum dolor sit amet</p>
<p class="h4">lorem ipsum dolor sit amet</p>
<p class="h3">lorem ipsum dolor sit amet</p>
<p class="h2">lorem ipsum dolor sit amet</p>
<p class="h1">lorem ipsum dolor sit amet</p>