読者です 読者をやめる 読者になる 読者になる

マテリアルデザイン(Material Design)の配色パレットが手に入るMaterial Paletteが便利

マテリアルデザイン(Material Design)の配色パレットが手に入るMaterial Palette

Googleが「Google I/O 2014」で発表したのがマテリアルデザインです。

『「昔からあるデザイン原則」と「新しいテクノロジーの融合」によるユーザーのためのデザイン』がゴールとして掲げられています。

アップルが推し進めるフラットデザインよりも、ドロップシャドーなどの現実要素を取り入れているのが特徴的です。個人的には、フラット過ぎる最近のアップルデザインよりもコッチの方が好きです。

で、このマテリアルデザインにはカラーパレットも提案されています。

Color - Style - Google design guidelines

f:id:niwaringo:20141219194123p:plain

が…… ツールの整備がプロユースのみで、ちょっと使いたい場合などには、まだまだ使いにくいのが現状です。angular-materialでのthemeがもっと使いやすくなって欲しい……


こんな現状に一筋の光をさしてくれるのが、「material palette」です。

使い方は簡単、2色選ぶだけでこのようなmaterialデザインなカラーパレットをつくってくれます。

f:id:niwaringo:20141219194345p:plain

動画もとってみました。

カラーパレットは、css, sass, svg, xml, pngでダウンロードする事ができます。

ちょっとマテリアルデザインなモックなどを作る時などに重宝しそうですね :)