個人的に役立ったデザイン素材やTips、WEBサービス、役立つグッズ、あれやこれやをご紹介

フラット・マテリアルデザインのカラーで瞬時に美しいグラデーションが作れるお手軽ツール「Blend」

フラット・マテリアルデザインのカラーで瞬時に美しいグラデーションが作れるお手軽ツール「Blend」

フラット・マテリアルデザインのカラーで瞬時に美しいグラデーションが作れるお手軽ツールをご紹介。
背景に美しいグラデーションを利用したサイトやアプリをよく見かけますが、そうしたグラデーションを簡単に手早く作成できるツールです。
ベースとなるカラーは、フラットデザイン、マテリアルデザイン。
それらを組み合わせるだけで簡単に生成できます。
ご参考になれば幸いです。

フラット・マテリアルデザインのカラーを使った美しいグラデーションが作れるツール「Blend」

「Blend」は、フラットデザイン、マテリアルデザインのカラーを使った美しいグラデーションを簡単に作れるツールです。
使い方はとても簡単です。
左右のカラーパレットから、好きな色をクリックして選択します。

フラット・マテリアルデザインのカラーで瞬時に美しいグラデーションが作れるお手軽ツール「Blend」

あとは、中央のボタンを押すだけ。

フラット・マテリアルデザインのカラーで瞬時に美しいグラデーションが作れるお手軽ツール「Blend」

<>ボタンをクリックすると、CSSのコードが表示されますよ。

フラット・マテリアルデザインのカラーで瞬時に美しいグラデーションが作れるお手軽ツール「Blend」

ベースとなるカラーは、フラットデザイン、マテリアルデザインのほか、明度が階層化されているブルー、グリーン、レッド、イエローから選択可能です。

フラット・マテリアルデザインのカラーで瞬時に美しいグラデーションが作れるお手軽ツール「Blend」

これはお手軽すぎる!

Blend

お役に立てましたら、以下どれでも結構のですので、ポチリと……。

  • 0
  • 0
  • 0
  • 3

Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

この記事を読んだ人はこんな記事も読んでいます

「アナと雪の女王」の配色だってわかる!人気映画のカラー/配色を参考にできる「The Colors of Motion」

「アナと雪の女王」の配色だってわかる!人気映画のカラー/配色を参考にできる「The Colors of Motion」

カラー/配色を決定するのって本当に難しいですよね。 皆さんはどんな方法で決定しているのでしょうか。

記事を読む

Illustratorでのカラーワークで役立つ無料のカラースウォッチライブラリー12

デフォルトのIllustratorはスウォッチパネルがほぼ空状態です。 これは具合が悪い。 いち

記事を読む

効果的な配色なら!実践で使えるカラーパレット100

効果的な配色を!実践で使えるカラーパレット100

カラー・色は、あらゆる人の人生においてもっとも重要な要素の1つではないでしょうか。 特にデザイン領

記事を読む

アクセシビリティを考慮したWEBカラーと配色例90がすぐにわかる「Colors」

アクセシビリティを考慮したWEBカラーと配色例90がすぐにわかる「Colors」

アクセシビリティを考慮したWEBカラーと配色例90がすぐにわかるWEBサイトをご紹介します。 WE

記事を読む

CSS3の色名147色(RGB、HEX16進カラーコード併記)

CSS3の色名147色(RGB、HEX16進カラーコード併記)

CSS3になって、色名についても大幅に選択肢が増えたのをご存知でしょうか。 私は知りませんでした。

記事を読む

ブラウザ上で、色・カラーをすばやく分析・変換してくれるChrome機能拡張「Colorpeek」

Chrome機能拡張で色・カラーの分析・変換をすばやく行ってくれる「Colorpeek」が便利だった

記事を読む

配色に困ったら!参考配色例付き配色提案サービス「Color Hunt」が便利

配色に困ったら!参考配色例付き配色提案サービス「Color Hunt」が便利

配色に困ったときの強い味方! 配色の提案サービス(キュレーションサービス)をご紹介します。 配色に

記事を読む

カラーを遊べ!16進数のカラーコードのイベンダーゲームでHEX博士だ

カラーを遊べ!16進数カラーコードのイベンダーゲームでHEX博士だ

16進数カラーコードいわゆるHEXをイベンダーゲームで楽しみながら学べる「Hex Invaders」

記事を読む

Photoshopで明度を調節できるスクリプト「Lighten / Darken Color」で効率アップ

Photoshopでカラーの明度を簡単に調節できるスクリプトが便利だったのでご紹介。 「描画色」を

記事を読む

2016年春夏の流行色・トレンドカラーをCMYK/RGB/HEXでご紹介!国際見本市SpinExpo発表の流行色・トレンドカラー

2016年春夏の流行色・トレンドカラーをCMYK/RGB/HEXでご紹介!国際見本市SpinExpo発表の流行色・トレンドカラー

SpinExpoが2016年春夏の流行色・トレンドカラーを発表しましたので、CMYK/RGB/HEX

記事を読む