Color Viewfinder
App Storeでダウンロード

写真から便利なカラーパレットを作成する方法

参考写真を実用的なパレットに変えます。ニュートラルとアクセントをサポートするメインカラーを選択し、結果を保存またはエクスポートします。

簡単な回答

1 つの明確な参照画像から色を抽出し、選択した各色に役割を与えます。メインカラー、ニュートラルカラー、アクセントカラーを備えたコンパクトなパレットは、画像内のすべての色をフィルター処理せずに集めたものよりも使いやすいです。

一歩ずつ

  1. プロジェクトの画像を選択してください

    部屋の場合は、残る資料の写真を使用します。視覚的なアイデンティティとして、プロジェクトに合った雰囲気の画像を選択してください。最初のパレットを評価する前に、無関係な参照を混合しないようにしてください。

  2. カラービューファインダーで色を抽出する

    画像を開くか、カメラのスナップショットを撮り、生成されたパレットを確認します。利用可能なレイアウトを比較し、グレア スポットや深い影ではなく被写体を表す色を特定します。

  3. 各色に役割を割り当てる

    広い領域にはメインカラーを選択し、背景には中間色、小さなアクセントには色を選択します。テキストと境界線の濃いまたは薄いオプションを維持します。見本だけに頼るのではなく、サンプル レイアウトでこれらの役割をテストしてください。

  4. 次のツールのために保存してエクスポートします

    後で使用するためにパレットを保存したり、個々のコードをコピーしたり、受け取ったツールに応じて Adobe ASE、JSON、CSS、または CSV をエクスポートしたりできます。エクスポートされたファイルを開くか、コードを貼り付けて、期待どおりの色が表示されていることを確認します。

例: 海辺の写真を使用する

海辺の画像では、背景に砂、見出しに濃い青、ボタンに小さなサンゴのアクセントを使用することが考えられます。ご自身の画像から実際のコードを抽出し、完成したデザインの文字のコントラストを確認する構成例です。

結果を使用する前に

パレットは出発点であり、アクセシビリティ テストや物理的なマテリアルの仕様ではありません。インテリアやプリントの場合は、ご注文前に目的の照明の下で実際のサンプルを比較してください。

写真パレットとHEXコードを表示するカラービューファインダー
App Store のリストからの製品のスクリーンショット。インターフェイスのテキストは言語とバージョンによって異なる場合があります。

アプリを探索する

App Storeで見る