やわらかクリーム配色

暮らし、手帳、小さなお店、穏やかな内容に合う低彩度の暖色配色。

ビジュアルシステム 配色クリーム低彩度暮らし感
Soft cream palette moodboard mockup with cream, blush, sage, and muted green-gray design cards.
visual-system

Cream Day

やさしく、清潔で、圧がない

使い方

01

ベース

  • 大きな面にはクリームや暖かい白を使う。
02

補助色

  • くすみピンクやセージグリーンを補助に使う。
03

締め色

  • 深いグリーンやグレーで文字を読みやすくする。

そのまま応用できる例

Design specs

Color values

Cream base

#fff3d8 · RGB(255, 243, 216)

Dominant background for calm lifestyle layouts.

Dusty blush

#eecfba · RGB(238, 207, 186)

Soft block, label area, or product backdrop.

Sage support

#b8c6a6 · RGB(184, 198, 166)

Secondary panel, checklist fill, or quiet divider.

Muted green-gray

#6f7d5f · RGB(111, 125, 95)

Readable text, anchor line, and small icon color.

Type and size

Mood title

  • Use a soft serif or rounded system sans at 34-48px, 650-800 weight, with generous line-height around 1.12.

Small labels

  • Use 13-16px labels, 600-750 weight, and avoid all-caps if the page should feel gentle.

Layout rules

Color ratio

  • Use a 70/20/8/2 ratio: cream dominates, blush or sage supports, dark green-gray anchors text, one tiny accent remains optional.

Spacing

  • Use 28-40px outer padding and 16-24px gaps. Let whitespace do more work than borders.

Build notes

  • Useful for journal templates, cafe menus, gentle product explainers, and lifestyle guide covers.
  • Always test contrast before using the muted colors for small text.

置き換えられる部分

色の役割

  • 背景
  • やわらかい色面
  • 文字色
  • 小さなアクセント

向かない場合

  • 強いセール感が必要な時。
  • 技術的な信頼感が必要なブランド。
  • 小さい文字の対比が弱い場合。

展開例

  • ピンクをくすみブルーに替えると学習感が出る。
  • 暖かい茶色にするとカフェ向けになる。
  • 白を増やすとポートフォリオ向けになる。

使用時の注意

  • 文字のコントラストを確認する。
  • 全色を同じ面積で使わない。
  • 一つの色を主役にする。

向いている用途

暮らし手帳小さなお店

関連アイデア

近い構造、雰囲気、用途を続けて見られます。