CSS

【CSS】CSSグラデーションで実装されたSunrise

March 12, 2017
sunrise

SunriseはアニメーションCSSグラデーションで実装された日の出。

HTML

9種類のグラデーションが順番にフェードしながら変化していきます。

    <div class="container">
      <div class="grad background-1"></div>
      <div class="grad background-2"></div>
      <div class="grad background-3"></div>
      <div class="grad background-4"></div>
      <div class="grad background-5"></div>
      <div class="grad background-6"></div>
      <div class="grad background-7"></div>
      <div class="grad background-8"></div>
      <div class="grad background-9"></div>
    </div>