アースカラーのカラーパレットは、信頼できるクレイ、サンド、バーク、ストーン、ソフトな植物などのグラウンドカラーから作られます。これらのカラーは、デジタルや印刷デザインにおいて、瞬時に穏やかで、ナチュラル、そして時代を問わず魅力的に感じられます。
以下に、HEXコード付きのアーストーンカラーパレット20選を紹介します——それぞれにおすすめの用途例と、マッチするビジュアルを生成するためのAIプロンプトも用意しています。
この記事の内容
なぜアーストーンのカラーパレットはこれほど効果的なのか
アーストーンが親しみやすく感じられるのは、木、土、石、リネン、レザー、そして太陽で温まったクレイといった、日常で目にする素材に由来しているからです。その親しみやすさが、デザインを近づきやすく“本物”に感じさせ、ブランドや製品への信頼を高めます。
また、アースカラーはとても柔軟です。暖色系(テラコッタ、アンバー、ココア)でも、寒色系(セージ、ストーン、ミスティグリーン)でも、全体の統一感を保ちながら使うことができます。これにより、UIやパッケージ、エディトリアルレイアウトの構築が容易になります。
さらに、アースカラーは彩度の高い明るい色に比べて目に優しいため、文章量の多いインターフェースや長文コンテンツ、プレミアムな商品プレゼンテーションにも最適です——特にコントラストを上手く調整した場合、より効果を発揮します。
20以上のアースカラーパレット案(HEXコード付き)
1) キャニオンクレイ

HEX: #C97B63 #A65A44 #6B4A3A #E6D2C3 #2F2A26
雰囲気: 太陽に焼かれた、グラウンド感、ラスティック
おすすめ用途: 職人製品のブランディング
サンベイクドクレイと谷間の影が、このアースカラーに温かく手作り感のある雰囲気をもたらします。クラフトブランドやカフェメニュー、素材感のある正直なパッケージに最適です。テラコッタやココアの色味と、たっぷりのソフトベージュで余白を作りましょう。ポイント:ロゴやテキストにはほぼ黒のカラーを使い、強いコントラストを保ちつつ硬すぎない印象に。
media.ioを使って生成したキャニオンクレイの画像例
Media.ioは、ブラウザ上で動画・画像・音声の作成と編集ができるオンラインAIスタジオです。
2) セージメドウ

HEX: #8A9B68 #6F7D4E #C9D3B1 #F2E9D8 #3A3F2D
雰囲気: 穏やか、空気感、ボタニカル
おすすめ用途: ウェルネスブログのビジュアル
柔らかなセージグリーンとクリーミーな明るいニュートラルは、静かな朝の草原を散歩するような印象を与えます。ウェルネス関連のブログやサステナブルブランド、清潔感と癒しを求めるパッケージにおすすめです。濃いオリーブは見出しに、淡いクリームは背景に適しています。ポイント:グリーン同士のグラデーションは控えめにして、濁った印象にならないように注意。
media.ioを使って生成したセージメドウの画像例
3) デザートダスク

HEX: #D2A679 #B77A4B #8C5A3C #6E6A5E #F3E7D6
雰囲気: 夕陽、冒険的、ナチュラルカラー
おすすめ用途: 旅行ポスターのデザイン
ゴールドの砂と落ち着いた石が、砂漠の夕暮れの雰囲気を作り出します。このアースカラーパレットは、トラベルポスターやアウトドアイベント、暖かさを加えながらも目立ち過ぎないエディトリアルグラフィックに最適です。サンディタンとライトクリームを大きな形に使用し、ダスキーグレーでレイアウトを引き締めましょう。ポイント:ミッドブラウンはアイコンや区切り線に使って、デザインを一体感のある仕上がりに。
media.ioを使って生成したデザートダスクの画像例
4) リバーバンクストーン

HEX: #8F8C84 #6E6A63 #C7C2B9 #EAE6DD #3B3834
雰囲気: 静か、バランス、モダンニュートラル
おすすめ用途: 建築ポートフォリオのレイアウト
冷たい小石や風化した流木の色調が、落ち着いたギャラリーのような雰囲気をもたらします。このアーストーンカラーパレットは、建築ポートフォリオや商品カタログ、カラフルすぎない質感重視のミニマルウェブサイトに最適です。オフホワイトやライトストーンをベースに、チャコールはタイトルやナビゲーションに使いましょう。ポイント:アクセントが必要なときは、コッパーフォイルのような暖色を控えめに追加します。
media.ioを使って生成したリバーバンクストーンの画像例
5) フォレストフロア

HEX: #3F4A2A #5E6B3A #8A7B54 #C2B08A #1F1E18
雰囲気: 森林、ワイルド感、しっかりとした落ち着き
おすすめ用途: アウトドアアパレルの広告
苔のグリーンと樹皮ブラウンは、ブーツの下の湿った落ち葉を連想させます。このアースカラーパレットは、アウトドアアパレルの広告やキャンプブランド、オーセンティックが求められる商品ページに最適です。タンとカーキは背景に、見出しやコールトゥアクションにはミッドグリーンを使いましょう。ポイント:一番暗いトーンは小さな部分に使い、リッチ感を出しつつ重くなり過ぎないように。
media.ioを使って生成したフォレストフロアの画像例
6) テラコッタブルーム

HEX: #D07A4B #B85E3C #7A3E2C #F0D2BF #4A2B22
雰囲気: 暖かい、ロマンチック、手作り風
おすすめ用途: レストランメニューのデザイン
クレイレッドの暖かさと優しいニュートラルが、陶器やドライフラワー、キャンドルの灯るテーブルを思わせます。このアースカラーは、レストランのメニューやワインバー、ブティック系フードブランドにもぴったり。淡いピーチと十分な余白を合わせ、ヘッダーや価格には深みのあるブリックカラーを。本文はダークココアでまとめると、ウォームな背景でも読みやすくなります。
media.ioを使って生成したテラコッタブルームの画像例
7) オリーブグローブ

HEX: #6B7A3A #8C9A4E #B9B27A #E9E2C6 #2E3322
雰囲気: 太陽の下、オーガニック、地中海風
おすすめ用途: オリーブオイルのパッケージ
オリーブの葉と金色のピットが、太陽の光があふれる地中海の雰囲気を与えます。グルメ食品ラベルやファームトゥテーブルのブランディング、ラスティックなパッケージに適しています。クリーミーベージュとイエローオリーブでフレンドリーなベースを作り、ダークグリーンでスタンプやブランドマークを。ポイント:ナチュラルな風合いを損なわないよう、ライトトーンは非コーティングの紙に印刷しましょう。
media.ioを使って生成したオリーブグローブの画像例
8) サンドストーントレイル

HEX: #D8C1A1 #C3A27A #A07B52 #6C5A44 #F5EFE5
雰囲気: 柔らかい、太陽に温められた、親しみやすい
おすすめ用途: ホームデコールECバナー
サンドストーンの暖かさとやさしいブラウンが、心地良く住みやすい印象を与えます。ホームデコールのバナーやライフスタイルブログ、暖かみのあるプロダクトページにおすすめです。クリームベースに明るいサンドを組み合わせ、濃いブラウンはボタンや目立つラベルに使いましょう。ポイント:影やボーダーはトープ系にして、無機質なグレー印象を避けて。
media.ioを使って生成したサンドストーントレイルの画像例
9) マッシュルームラテ

HEX: #B8A998 #9C8B78 #7E6B58 #EDE3D7 #2B2622
雰囲気: 居心地がよい、ミニマル、カフェシック
おすすめ用途: ライフスタイルアプリ向けミニマルUI
クリーミーなラテトーンと柔らかなマッシュルームブラウンが、落ち着きと居心地の良さを生み出します。インターフェースで高級感を演出できるため、ライフスタイルアプリ、日記ツール、サブスクリプションのダッシュボードなどに理想的なアースカラースキームです。ライトクリームを控えめなトープカードと組み合わせ、濃いエスプレッソカラーをテキストやアイコンに使いましょう。ヒント:インタラクティブなステートは、コントラストを強めすぎず一段階だけ暗くして目立たせると穏やかな印象になります。
media.ioで生成されたマッシュルームラテの画像例
10) コッパーパティナ

HEX: #A45A3A #C47A4E #6D7B68 #D8D2C6 #2A2A27
雰囲気: インダストリアル、洗練、ヴィンテージモダン
おすすめ用途: エディトリアルマガジンのスプレッド
磨き上げられた銅とやわらかな緑青(パティナグリーン)が、リノベーションされたロフトの古い金具のような趣を醸しだします。これらのアースカラーはエディトリアルスプレッドやルックブック、商品ストーリーで温かみと気品を加えたい場面に最適です。ページのベースには明るいグレージュを、強調やセクションのマーカーにはコッパーを使ってください。ヒント:グリーンは控えめにして、銅色を主役にすると良いでしょう。
media.ioで生成されたコッパーパティナの画像例
11) ハーベストグレイン

HEX: #D9B56C #C9963C #8A6A2E #F3E5C5 #3A2E1E
雰囲気: 明るい、素朴、季節感
おすすめ用途: ファーマーズマーケットのチラシ
黄金色の穀物と香ばしいスパイスのトーンが、活気ある晩夏のエネルギーをもたらします。ウェルカムで手作り感を出したいファーマーズマーケットやフードフェスティバル、季節プロモーションに最適です。ペールクリームとゴールドを大きなブロックに使い、濃いブラウンでテキストやボーダーをまとめましょう。ヒント:オリーブブラウンでシンプルな穀物や葉っぱのイラストを加えて、より個性をプラスできます。
media.ioで生成されたハーベストグレインの画像例
12) チャードバーク

HEX: #2B241E #4A3A2B #7A5B3E #BFA68A #E7DED2
雰囲気: ムーディー、スモーキー、ラグジュアリー
おすすめ用途: プレミアムウイスキーのブランディング
スモーキーブラウンと焦げた木の奥行きが、ドラマティックで暖炉のような雰囲気を生み出します。これらのアースカラーは、プレミアムなスピリッツやレザーグッズ、重厚で節度ある男性的なパッケージデザインにぴったりです。ラベルのベースには温かみのあるベージュ、最も濃い色は封印やモノグラム、主要タイポグラフィに使いましょう。ヒント:中間のブラウンをエンボス加工やスポットグロスでリッチに仕上げると、新たな色を加えずに高級感を出せます。
media.ioで生成されたチャードバークの画像例
13) サンベイクトアドービ

HEX: #E1A07A #C77A55 #9E5A3E #F6E2D3 #4D3328
雰囲気: 温かみ、親しみやすさ、南西部風
おすすめ用途: ブティックホテルのランディングページ
太陽で焼かれた壁と柔らかな粘土の影が、親しみやすくリラックスした雰囲気を演出します。ブティックホテルのページや旅行プラン、温かみが重要なライフスタイルブランディングで美しく機能します。淡いピーチとアドービタンは背景に、ダークブラウンはナビゲーションやフッターに使ってください。ヒント:写真も暖色系でまとめて、UIとイメージを一つの物語のように統一しましょう。
media.ioで生成されたサンベイクトアドービの画像例
14) ラスティックリネン

HEX: #E8DDC9 #D2C2A9 #B39B7E #7A6A58 #2F2A25
雰囲気: 柔らかい、控えめ、タイムレス
おすすめ用途: ウェディングウェブサイトのテーマ
洗いざらしのリネンやアンティークなトープが、時を超えた控えめなエレガンスを演出します。ウェディングサイトやステーショナリー、暖かみのあるミニマルブランドに最適なアースカラーです。明るい2色を背景やセクションに、深いトープはボタンやディバイダーに使いましょう。ヒント:控えめな紙や布のテクスチャと組み合わせて、パレットが平坦にならないように。
media.ioで生成されたラスティックリネンの画像例
15) ペブルクリーク

HEX: #A2A09A #7D7A73 #CFCBC2 #EFECE6 #4A4A45
雰囲気: クリーン、静か、コンテンポラリー
おすすめ用途: SaaSダッシュボードUI
なめらかな小石と小川沿いの石が、クリーンで現代的な中立性を生み出します。SaaSダッシュボードやファイナンスツール、データ重視の画面で明瞭性を重視したい時におすすめです。ほぼホワイトをライトグレーパネルと組み合わせ、ダークグレーはラベルやチャート軸に使いましょう。ヒント:アラートには温かみのあるアクセントを1色だけ加え、ステータス表示を分かりやすくしましょう。
media.ioで生成されたペブルクリークの画像例
16) クレイポタリー

HEX: #B86B4B #8E4D35 #D9B6A5 #F2E7DE #3A2A23
雰囲気: 手作り風、温かい、柔らかい
おすすめ用途: 陶器プロダクト写真
手びねりの陶器とあたたかな釜のトーンで、親密でクラフト感のあるパレットに仕上がります。陶器ショップやクリエイターのポートフォリオ、テクスチャとクラフト感にこだわる商品ページに最適です。ライトクリームとローズクレイを背景やパッケージのインサートに使い、深いブラウンで全体の印象を引き締めましょう。ヒント:マット質感にすると、柔らかな色合いをきれいに保てます。
media.ioで生成されたクレイポタリーの画像例
17) ワイルドハーブ

HEX: #5C6B43 #7E8B5A #AAB58B #E6E2D3 #2A2F22
雰囲気: フレッシュ、ナチュラル、やや素朴
おすすめ用途: オーガニックスキンケアの広告
砕いたハーブや葉茎が、フレッシュでナチュラルなエネルギーとちょっとした素朴さを加えます。オーガニックスキンケア広告、リフィル可能な商品、エコフレンドリーなランディングページにぴったりです。淡いニュートラルと控えめなグリーンをベースに、最も濃い色で成分の強調をしましょう。ヒント:タイポグラフィはシンプルにし、グリーンのトーンでストーリー性を持たせて。
media.ioで生成されたワイルドハーブの画像例
18) セピアジャーナル

HEX: #A17C5B #7C5A40 #5A4332 #E7D8C8 #2B231E
雰囲気: ノスタルジック、文学的、温かみ
おすすめ用途: ブックカバーのコンセプト
セピアインクやエイジングペーパーの色合いが、ノートや手紙、図書館の棚を想起させます。このアーストーン配色は、ブックカバーデザイン、作家のブランディング、クラシックな印象を狙いたいポッドキャストアートなどに最適です。ペーパーベージュをベースに、濃いブラウンでタイトルや枠に階層感を持たせましょう。ヒント:細かなグレインを加え、縮小表示でも読みやすいコントラストを保つと効果的です。
media.ioで生成されたセピアジャーナルの画像例
19) ウッドランドミスト

HEX: #6E7B6A #8F9B8A #BFC8B9 #E9ECE4 #3A3F39
雰囲気: クール、静寂、ナチュラルモダン
おすすめ用途: プレゼンテーションスライドデッキ
霧に包まれた森と控えめな常緑樹が、穏やかでモダンな雰囲気を与えます。プレゼン資料や企業のサステナビリティレポート、ナチュラル志向の落ち着いたテックブランドに合います。淡い霧色と中間のセージでチャートやコールアウトを、チャコールグリーンは見出しに使いましょう。ヒント:グラフはフラット塗りにして、柔らかい色合いの差異を明確に。
media.ioで生成されたウッドランドミストの画像例
20) アンバーソイル

HEX: #C9893B #E0B06A #8A5B2B #F4E6D0 #2F241B
雰囲気: 温かい、前向き、アーシー
おすすめ用途: 秋のイベントポスター
アンバーの光と豊かな土のブラウンが、生き生きとして季節感のある温かみをもたらします。秋のイベントポスターやクラフトフェア、地域のお知らせなど、友好的なエネルギーと安定感ある雰囲気を出したい時に最適です。クリームとライトアンバーで大きな形をつくり、ディープブラウンでコントラストと要所の強調をしましょう。ヒント:他の色はできるだけニュートラルにして、アンバーの存在感を生かすと良いです。
media.ioで生成されたアンバーソイルの画像例
アースカラーと相性の良い色は?
アーストーンは柔らかなホワイト、温かいグレー、クリーミーなニュートラルなどと相性が抜群です。これらの明るいサポートカラーは、UIや印刷物で濃いブラウンやオリーブの可読性も高めてくれます。
アクセントカラーには、控えめなブルー(スレート・デニム・ダスティネイビー)や彩度を落としたグリーン(セージ・ユーカリ)を使うとナチュラルな一貫性が保てます。より強いインパクトが必要なときは、テラコッタ・アンバー・コッパーなどをピンポイントで使い、ネオンのような明度の高い色は避けましょう。
迷った場合は色温度を合わせましょう。温かみのあるアースパレット(クレイ、サンド、キャラメル)は暖色系ニュートラルと好相性、ストーンやミストを含むパレットは、クールなホワイトやチャコールグリーンと組み合わせるとクリーンにまとまります。
リアルなデザインでアーストーンパレットを活用する方法
背景はニュートラルベース(クリーム、グレージュ、オフホワイト)から始め、UIの主要パーツ(ボタン、タブ、セクションヘッダー)には一つの中間色のアースカラーを選びます。最も濃い色はテキストやナビゲーション専用にして、可読性を常に確保してください。
ブランディングやパッケージデザインでは、質感が大きな役目を果たします。未加工紙やきめの細かいグレイン、マット仕上げなどでアースカラーに自然なリアリティを。メタリック(銅や青銅)のアクセントは、あくまでハイライトとして控えめに使いましょう。
印刷物やSNS用テンプレートは明確な階層構造を意識。明るいタンやピーチで大きな温かみを出し、中間のブラウンやグリーンで支え、ほぼブラックのディテールで締めることで、落ち着いていながら活気のあるレイアウトに仕上がります。
AIでアースカラーパレットのビジュアルを作成する
HEXコードがすでに決まっていれば、次はそれに合ったビジュアル(商品モックアップ、ポスター、メニュー、UI画面、ブランドアイデンティティセット)を作りましょう。AI生成なら、複数のアイテムでも色の雰囲気を統一したまま素早く作成できます。
1つのパレットを「アートディレクション」として使い、同じプロンプトスタイル(製品画像、クリーンなUIモックアップ、エディトリアルスプレッドなど)を再利用すると、全体が統一感のあるシステムに見えます。マテリアルや光、背景などプロンプトを微調整するだけでアース感を強く出せます。
何種類かバリエーションを生成し、ベストな構成を選んでから、タイプやアイコン、レイアウトなど最終要素を画像の上に配置し、コントラストも十分に保ちましょう。
アースカラーパレット よくある質問
-
アースカラーパレットとは何ですか?
アースカラーパレットとは、自然素材や風景からインスピレーションを得た色合いのセットです。テラコッタ、砂色、バークブラウン、オリーブグリーン、ストーングレー、温かみのあるクリーム系ニュートラルなどが代表です。 -
アーストーンは暖色系ですか?寒色系ですか?
どちらもあります。クレイ、アンバー、ココアは暖色系のアースカラー、セージや淡いグリーン、川石のグレーなどはどちらかといえば寒色系です。多くの「アーシー」なパレットは、自然な落ち着いたトーンで両方を混ぜています。 -
アースパレットが地味にならないためにはどうすればいいですか?
テキストに濃いチャコールやエスプレッソ色でコントラストを強くし、質感(グレイン・紙・リネンなど)を追加、「主役」になるアクセントカラー(コッパー・アンバー・テラコッタ)を一貫して使うと効果的です。 -
アーステイストなUIのベストな背景色は?
オフホワイトやクリーミーなニュートラルが特に使いやすいです。インターフェースを軽やかに保ちつつ、ブラウンやグリーンが意図的に映えます。ウォームクリーム、グレージュ、ごく薄いストーン色などもおすすめです。 -
アースカラーは現代のブランディングに合いますか?
はい—アースカラーは、クリーンなタイポグラフィ、ミニマルなレイアウト、バランスの取れたスペースと組み合わせることで、とてもモダンに見せることができます。ポイントは、中間色が濁らないようにニュートラルカラーは明るく保ち、ダークトーンを構造のために使うことです。 -
アースカラーに合うアクセントカラーは何ですか?
落ち着いたブルー(スレート/デニム)、柔らかなホワイト、チャコール、そして温かみのあるメタリック(カッパー/ブロンズ)は信頼できるアクセントです。よりエネルギッシュにしたい場合は、アンバーやテラコッタのようなコントロールされた暖色を取り入れてください。 -
AIでアーストーンの画像を生成し、色を一貫させることはできますか?
はい。固定パレットの「ムード」(素材、ライティング、背景)プロンプトを再利用し、小さな変更を加えて何度か生成します。その中からパレットに最も合った結果を選び、デザイン要素の色をその支配的なトーンに合わせてください。
次へ: オレンジクリームカラーパレット

