📖 基本的な使い方
ステップバイステップガイド
- キーワードを入力する:気分や雰囲気を表すキーワードを入力フィールドに入力します。例えば「夏」「落ち着き」「モダン」「カフェ」など、イメージするキーワードを自由に入力できます。複数の単語を組み合わせてもOKです。
- カラー提案ボタンをクリック:入力したキーワードに合わせて、システムがカラーパレットを提案します。3色のカラーが表示されます。Enterキーを押しても実行できます。
- 結果を確認:生成されたカラーが表示されます。各カラーは16進数コード(HEXコード)で表示されているので、デザインツールに直接コピーできます。
- カラーをコピー:気に入ったカラーをクリックすると、自動的にクリップボードにコピーされます。Photoshop、Figma、Adobe Illustratorなど、あらゆるデザインツールに貼り付けが可能です。
おまかせボタンについて
キーワードを入力せずに「おまかせ」ボタンを押すと、ランダムに3色のカラーパレットが生成されます。決断に困ったときや、新しいインスピレーションが欲しいときに便利な機能です。
💡 ポイント: キーワードを入力して「カラーを提案」と「おまかせ」の両方を試してみることで、同じキーワードでも異なる配色が得られます。複数の提案から最適な組み合わせを選んでください。
💡 使用例・実践シーン
Webサイトデザイン
シーン: 企業サイトのテーマカラーを決める
キーワード例: 「信頼感」「プロフェッショナル」「モダン」
使い方: こうしたキーワードを入力すると、落ち着きと信頼性を表現するカラーパレットが提案されます。メインカラー、アクセントカラー、背景色として活用できます。
キーワード例: 「信頼感」「プロフェッショナル」「モダン」
使い方: こうしたキーワードを入力すると、落ち着きと信頼性を表現するカラーパレットが提案されます。メインカラー、アクセントカラー、背景色として活用できます。
グラフィックデザイン(ポスター・バナー)
シーン: 季節のポスター制作
キーワード例: 「春」「新緑」「希望」 または 「秋」「紅葉」「温暖」
使い方: 季節のムードを反映したカラーパレットが生成されます。ビジュアルに統一感を持たせるのに効果的です。
キーワード例: 「春」「新緑」「希望」 または 「秋」「紅葉」「温暖」
使い方: 季節のムードを反映したカラーパレットが生成されます。ビジュアルに統一感を持たせるのに効果的です。
ソーシャルメディア投稿
シーン: InstagramやPinterestの統一された雰囲気作り
キーワード例: 「明るい」「優しい」「ナチュラル」
使い方: アカウント全体の配色を決めることで、フォロワーに統一された印象を与えることができます。フィード全体の見栄えが向上します。
キーワード例: 「明るい」「優しい」「ナチュラル」
使い方: アカウント全体の配色を決めることで、フォロワーに統一された印象を与えることができます。フィード全体の見栄えが向上します。
ブレインストーミング・会議
シーン: デザイン案を複数人で検討する
キーワード例: プロジェクトコンセプト
使い方: 「おまかせ」ボタンを複数回実行して複数の提案を得ます。チーム内で気に入ったカラーを投票して選ぶことで、スムーズに配色を決定できます。
キーワード例: プロジェクトコンセプト
使い方: 「おまかせ」ボタンを複数回実行して複数の提案を得ます。チーム内で気に入ったカラーを投票して選ぶことで、スムーズに配色を決定できます。
🎯 コツ・テクニック
より効果的なキーワード選択
❌ 避けるべき入力:「赤」「青」などの色名をそのまま入力
✅ おすすめの入力:「情熱的な赤」「深い青」「柔らかな緑」
理由: より詳しく具体的なキーワードを入力するほど、細部まで気の利いたカラーパレットが提案されます。
✅ おすすめの入力:「情熱的な赤」「深い青」「柔らかな緑」
理由: より詳しく具体的なキーワードを入力するほど、細部まで気の利いたカラーパレットが提案されます。
複数回の実行で最適な配色を見つける
同じキーワードで何度も実行すると、毎回異なるカラーパレットが生成されます。気に入った配色が見つかるまで、複数回トライしてみてください。
例: 「カフェ」というキーワードで5回実行してみると、5つの異なるカフェテイストのカラーパレットが得られます。その中から最も自分のプロジェクトにマッチする組み合わせを選びます。
提案されたカラーの活用方法
提案された3色を必ずそのまま使う必要はありません。以下のように活用できます:
- 完全採用: 提案された3色をメインカラー、サブカラー、アクセントカラーとして活用します。最も簡単で統一感のある方法です。
- 部分採用: 3色の中から気に入った1~2色を選んで、他の色は自分で選定します。提案を参考にしながらカスタマイズできます。
- 配色の参考: 提案されたカラーから色合いやトーン(明度・彩度)の傾向をつかんで、それに合わせて別の色を選定することも可能です。
プロジェクトコンテキストに合わせたキーワード選定
🎯 実践例:
• スタートアップ企業サイト → 「革新的」「テクノロジー」「エネルギッシュ」
• ウェディング関連 → 「優雅」「上品」「ロマンティック」
• フィットネスアプリ → 「活動的」「力強い」「エネルギー」
• 瞑想・リラックスアプリ → 「落ち着き」「平穏」「自然」
• スタートアップ企業サイト → 「革新的」「テクノロジー」「エネルギッシュ」
• ウェディング関連 → 「優雅」「上品」「ロマンティック」
• フィットネスアプリ → 「活動的」「力強い」「エネルギー」
• 瞑想・リラックスアプリ → 「落ち着き」「平穏」「自然」
カラーコードの活用
生成されたカラーコード(16進数)はすべてのデザインツールで使用できます。以下のツールに直接貼り付けが可能です:
- Adobe Creative Suite(Photoshop、Illustrator、XD)
- Figma、Sketch などのデザインツール
- HTML/CSSなどのWeb開発
- Canva などのオンラインデザインツール
複数のキーワード組み合わせ
応用テクニック: 複数のキーワードを組み合わせて入力することで、より個性的な配色が得られます。
例:「夏」と「エレガント」を組み合わせると、夏らしさとエレガンスを両立させたカラーパレットが生成されます。
例:「夏」と「エレガント」を組み合わせると、夏らしさとエレガンスを両立させたカラーパレットが生成されます。