スマートフォンのWEBサイトデザインをはじめ、マテリアルデザインを導入するWEBサイトが増えてきました。マテリアルデザインとはZ軸の概念を取り入れ、WEBページ上の要素の重なりを現実世界に近い形で表わすもので、要素同士が重なるため、それだけに配色も重要になってきます。今日紹介するのはマテリアルデザインのためのカラーツールまとめたエントリー「9 Useful Tools for Creating Material Design Color Palettes」です。

material palette

いくつかのカラーツールがまとめれられていましたが、今日はその中からいくつか気になったものをピックアップして紹介したいと思います。

詳しくは以下

material mixer
ベースカラーとアクセントカラーを1色選ぶと、それに準じた色の候補をカラーコード付きでプレビューとともに出力してくれます。
　
　
　
　
　

Material Colors – Material Design Color Selection
マテリアルデザインによく利用されるカラーがならんでおり、カラーパレットから簡単にカラーコードを取得することが可能です。
　
　
　
　
　

Material Design Palette Generator
ベースカラーを選択することで、色の候補を提示してくれるツール。こちらはパレットでは無く、RGBでベースカラーを指定できるようになっています。
　
　
それらしい色というのはどのデザインでもあるもので、こういったツールは考える時間を短縮してくれるという意味では非常に有益なツールだと思います。原文では全部で9つのツールが紹介されていましたので気になる方は是非どうぞ。

9 Tools for Creating Material Design Color Palettes