内容

CSSでグラデーションの背景を作る場合にlinear-gradientを使用しますが、こいつの調整がなかなかめんどくさくないですか？

角度とか色の具合とかエディターで直接コードを打って、画面見て、コードを修正して、画面見て、、、この繰り返しですよね。

こういった面倒な作業を解消してくれるWEBサービスを提供しているサイトがありますので紹介します。

解決方法

「CSS Gradient」のサービスを使用する。

https://cssgradient.io/

使用方法

使用方法はいたって簡単です。

例えば、5色のグラデーションを付けたい場合は、

とすればOKです。

また、境目をはっきりさせた2色のグラデーション背景を指定したい場合は、

調整が完了したら画面したのCSSをそのままエディターにコピペすればOKです。

めっちゃ簡単にグラデーション背景を作れるので、ぜひ使ってみてください！

関連記事:

TS2305: Module ‘”react-router-dom”‘ has no exported member ‘RouteComponentProps’.が表示された時の解決方法 PhotoshopでSVG書き出しが出来なかったときの解決法 ショートコードをエディターで表示させる方法 オブジェクトとオブジェクトをマージしてコピーする方法