Materialette - マテリアルデザイン対応のカラーパレットを表示することができるメニューバーアプリ

2016年10月18日

［PR］記事内のアフィリエイトリンクから収入を得る場合があります

URLをコピーしました！

Googleが推進するフラットながら物の質感を生かしたデザイン手法「マテリアルデザイン」。Googleが開発するAndroid、Webサービス、アプリなどで広く採用されています。

今回紹介する「Materialette」はこのマテリアルデザインで使われているカラーパレットを表示することができるアプリケーションです。Electronフレームワークを使って作られていて、Windows/Mac/Linux用の実行ファイルがダウンロード可能。Macの場合メニューバーアプリとして使用することができます。

以下使用方法をご紹介。

Materialetteの使用方法

以下Mac版アプリの使用方法を説明します。GitHubからMaterialette-macOS-x.y.z.zipをダウンロードし、含まれているMaterialette.appをアプリケーションフォルダにコピーします。

▲Materialette.appを実行するとメニューバーにアイコンが表示れ、クリックすると上記画像のようなカラーパレットが表示されます。好みの色をクリックするとその色のカラーコードがクリップボードにコピーされる仕組みです。

カラーコードのフォーマットはRGB or HEXから選択可能。RGBの場合は"rgb(244, 67, 54)"、HEXの場合は"#f44336"といった文字列がコピーされます。

ウィンドウを表示し続けたい場合は「pinned」にチェックを入れておきましょう。

まとめ

Materialetteを使用すればマテリアルデザイン対応のカラーパレットを素早く参照することができます。マテリアルデザインを利用したWebサイト、アプリ等を開発しているデザイナーや開発者の方におすすめのアプリです。

	タイトル	Materialette
	公式サイト	https://mike-schultz.github.io/materialette/
	ソフトアンテナ	https://softantenna.com/softwares/7494-materialette
	説明	マテリアルデザイン対応のカラーを素早く参照、選択することができるメニューバーアプリ。