JSFiddle - React, Tailwind, and code Playground

HTML

<head>
    <link href='http://fonts.googleapis.com/css?family=Medula+One' rel='stylesheet' type='text/css'>
</head>

<h2 class="threedeetext">Spot</h2>

SCSS

h2 {
  text-transform: uppercase;
  font-size: 100px;
    font-family: 'Medula One', cursive;
    text-transform: none;
    font-weight: 40;
  margin: 20px 50px;
  float: left;

}

//Sass Magic
@mixin threedee($color) {
  color: $color; //Sets the text to the passed in color
  text-shadow:   //Uses shadows to create a 3D illusion
    0 2px 0 darken($color, 14%),
    0 4px 0 darken($color, 16%),
    0 6px 0 darken($color, 18%), //Increase percentages to darken shadows
    0 8px 0 darken($color, 20%),
    3px 8px 15px rgba(0,0,0,0.1),
    3px 8px 5px rgba(0,0,0,0.3);
}

.threedeetext {
  @include threedee(#6d879d); //Change only this color and apply the class in your HTML
}


body{background-coloor:#222;}
//For more information about Sass, visit sass-lang.com/