ITツール Webディレクターの仕事

美麗なグラデーションのサンプルCSSとPNGが大量に手に入るウェブサイト

webgradients

あなたのウェブサイト制作やデザイン制作できっと役に立つ!グラデーションサンプルを集めたサイト「WebGradients」をご紹介します。

webgradients

美しいグラデーションに見惚れろ!「WebGradients」とは

ウェブサイト「WebGradients」は、ウェブサイト制作やデザイン制作で活用できる「グラデーションのカラーパターンを集めたコレクションサイト」です。

webgradients_1

その数なんと180種類。サイトにアクセスしてサラサラーっと見渡すだけでも、自分のイメージしていた配色のグラデーションに出会えること間違いなしです。

お気に入りのグラデーションが見つかったら、右上のダウンロードボタンからPNG形式の画像をダウンロードできます。

webgradients_2

ウェブで使用する場合は右下の「Copy CSS」が便利。クリックするだけで、グラデーションのCSSをコピーできます。

webgradients_3

グラデーションをクリックすれば、画面全体にグラデーションを展開することもできます。

webgradients_4

その他、Photoshop と Sketch 用ファイルとして、すべてのグラデーションをまとめてダウンロードすることもできるみたいですね。デザイナーさんに取っては嬉しい機能なのではないでしょうか。

私は今後、アイキャッチの背景色のバリエーションとして活用しようかな。

それでは、今日はこのあたりで。

\ この情報をシェアしよう! /

  • この記事を書いた人

ばんか

Webディレクターとしてサラリーマンをやりつつ、個人でブログや執筆活動をするパラレルキャリアを実施中。 ITツールを日常で活かす方法を広く伝え歩くことをミッションとした「ITツールエバンジェリスト」です。AllAboutやYahooクリエイターズプログラムでも活動中。

-ITツール, Webディレクターの仕事
-, , ,