micomia株式会社の井上です。今回はAI Generated Thema Colorsについて解説していきます。
初心者にも分かりやすく解説していくのでぜひご一読ください。
1. AI Generated Thema Colorsとは
AI Generated Thema Colorsは、AIがカラーを選んでくれる機能です。Theme SettingsのColorsから使用できます。

2. AI Generated Thema Colorsの使い方
AI Generated Thema Colorsはプロンプトを入力して使用します。例として「tiger」と入れてみます。

するとこのような画面が生成されました。

抽象的なプロンプトでも試してみようと思います。今回は「stylish smartphone app」と入力します。

するとこのようなカラーが生成されました。

今の状態(デフォルト)だと右上がEditになっていますが、Exploreを選択すると


このようにいくつかのカラーの組み合わせの選択肢があるのでこの中から好きなものを選ぶことも可能です。Save Changesを押すとそのカラーが適用されます。

また、Generate with AIの隣にあるExtract from Imageは、画像から色を抽出することができます。例えば、お客様から「これと同じようなカラーでアプリを作って欲しい」と依頼されたときにその画像を読み込むことでカラーを抽出できます。
Import from Coolorsは、Coolorsというサイトを用いてカラーを選ぶことができます。Explore Project Colorsは、設定してあるカラーを変更することができます。

3. さいごに
今回はAI Generated Thema colorsについて解説していきました。現状見ている限り、生成されたものをこのまま使えるほど精度は高くないと思いますが、上手く使えば時間短縮になると思うのでぜひ本記事を参考にして実装してみてください。
本記事の内容を動画で観たい方は以下をご覧ください。





.jpg%3Falt%3Dmedia%26token%3Da3c76743-713e-48e5-945a-601a7438cb5c&w=3840&q=75)
.jpg%3Falt%3Dmedia%26token%3D910d6567-e2cd-4ea5-ad8a-07d925ce700b&w=3840&q=75)


.png%3Falt%3Dmedia%26token%3D856fae6b-5eed-41e0-993c-4a053186faf5&w=3840&q=75)


.png%3Falt%3Dmedia%26token%3Def6b9919-f6ea-4ed8-924b-90f297e0549b&w=3840&q=75)


.png%3Falt%3Dmedia%26token%3D8e864089-6895-4bb1-b90d-d607b8416753&w=3840&q=75)





