A CodePen by spacekat. Fairy Kei pastel typographic style - I was inspired by the typography I saw on a Yerba Buena poster (http://cl.ly/image/3I1a3P2W161n) on the way to work, and wanted to create the same effect in CSS. The starting point colors from t

index.html

<h1 class="fairy-kei-gradient">dark Stardust</h1>

<div>
<h2 class="fairy-kei-solid">3rd Street Gallery</h2>
</div>
<div>
<h2 class="fairy-kei-solid">January 11-13</h2>
</div>

style.scss

@import "compass";
@import url(http://fonts.googleapis.com/css?family=Lato:700,700italic);

h1, h2 {
  font-family: 'Lato', sans-serif;
  text-transform: uppercase;
  display: inline;
  padding: 0 5px;
  line-height: 1.4em;
  color: #fff;
}

h1 {
  font-size: 4em;
  letter-spacing: 0.09em;
  font-weight: 700;
  font-style: italic;
}

h2 {
  font-weight: 700;
  font-size:2em;
  letter-spacing: 0.04em;
}

.fairy-kei-solid {
  background-color: #C1E5E4;
}

.fairy-kei-gradient {
  $experimental-support-for-svg: true;
  @include background-image(linear-gradient(left, #C1E5E4, #EDD8EF, #F0C0D8));
}