ITエンジニア/デザイナ向けにオープンソースを毎日紹介

Flutterでは基本的なUIコンポーネントをあらかじめ提供しています。それらを組み合わせるだけでUIが作れるのは便利ですが、色がFlutterっぽさを感じさせるものなのが辛いところです。独自のカラーリングにしようと思うと、一つ一つ調整が必要になります。

そこで使ってみたいのがPanacheです。Web上でFlutterのカラーリングを設定できます。

Panacheの使い方

まずベースになる色を決めます。

カラーリングはパレットを使って決められます。

デザイン画面です。プレビューを見ながら色を設定できます。

コンポーネントごとに細かく決められます。

最終的にコードでダウンロードできます。

Panacheはライト、ダーク双方のカラーリングを設定できます。後は状態に応じてカラーテーマを設定するだけでできあがります。プレビューもあるので、詳細までこだわりながら色設定ができるでしょう。

PanacheはDart製のソフトウェア(ソースコードは公開されていますがライセンスは明記されていません)です。

panache_web

rxlabz/panache: ? Flutter Material Theme editor

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2