2017年07月7日(金)
アニメーションするグラデーションを実装できるCSSを生成してくれるサイト「CSS Gradient Animator」
こんにちは。
今回はアニメーションするグラデーションを実装できるCSSを生成してくれるサイト「CSS Gradient Animator」です。徐々に色が変化するグラデーションを実装できるジェネレーターを紹介します。
アニメーションするグラデーションを実装できるCSSを生成してくれるサイト「CSS Gradient Animator」!
CSS Gradient Animator
https://www.gradient-animator.com/
「CSS Gradient Animator」の使い方
使い方は簡単で、画面右側を設定していきます。
「Gradient Angle」でグラデーションの角度を、「Scroll Angle」で位置を、「Speed」で時間を設定しますよ。
「Add colour +」で色を2色以上指定します。
最後に「Preview」をクリックすると設定が反映されますよ。
あとは画面右側のコードをコピべするだけです。
![]()
author:
Web Design Magazine
広島県在住のフリーランスWebデザイナーのBLACKBLOCKさんが運営されている個人ブログ。インテリアやファッションなどセンスが光る様々な記事を更新されていますが、アプデでは特にWeb制作に関する情報をピックアップしてご紹介しています。
関連記事
Ads
広島県在住のフリーランスWebデザイナーのBLACKBLOCKさんが運営されている個人ブログ。インテリアやファッションなどセンスが光る様々な記事を更新されていますが、アプデでは特にWeb制作に関する情報をピックアップしてご紹介しています。Web Design Magazineの記事『アニメーションするグラデーションを実装できるCSSを生成してくれるサイト「CSS Gradient Animator」』についてまとめています。
この記事は特にアニメーション・CSS3について書かれており、 HTML+CSSコーディング、Webサービスのカテゴリーに分類されます。気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のWeb Design Magazineで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとWeb Design Magazineの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
Ads