これは覚えておきたいと思ったので備忘録。「WebGradients」はクールなグラデーションを集めたサイトで、全180種類ものグラデーションカラーがまとめられています。
サイトでは以下キャプチャのような形で多数のグラデーションが一覧化されており、それぞれグラデーションのサークルをクリックすることでウィンドウ全体にそのカラーを表示させることができるようになっています。
多数のグラデーションがまとめられているので、眺めているのだけでもカラーの組み合わせなどいろいろと参考になる部分はありますが、こちらのサイトは実際にそのカラーを使いたいと思ったときにも便利な作りになっており、各カード左下で使用されているカラーコードを確認できたり、右下の「Copy CSS」という箇所をクリックするだけで簡単にCSSのlinear-gradientで表示するためのコードをコピーできるようになっています。
また、右上にあるボタンからはPNG形式のイメージとしてダウンロードできるようになっており、ダウンロードできるPNGは2400×2000というサイズなので様々な用途に利用できると思います。
さらに、ページ右上に表示されているボタンからはPhotoshopやSketchでこれらのグラデーションを利用できるパックも配布されています。
Gumroad経由ではダウンロードではありますが、デザインでこれらのグラデーションを多用したい人には嬉しいですね。
こういったグラデーションをまとめたサイトはいくつかありますが、個人的に見たことある中では一番見やすく且つ使いやすい印象だったので、今後よく利用させてもらいそうです :)