ガイド
ブランドカラーの周辺色を選ぶ方法
主役カラーを活かしながら補助色とニュートラルを作る手順です。
補助色は主役を目立たせるために使います。
Start with one brand anchor
Lock your primary brand color first.
Treat it as the reference point for all nearby choices.
Pick quieter supporting colors
Use softer saturation for secondary colors so the brand tone stays dominant.
Neutrals should handle structure and readability.
Assign clear roles
Decide which colors are for backgrounds, borders, and highlights.
Role clarity prevents random color usage.
- Secondary color for supporting UI blocks.
- Neutral ramp for surfaces and text.
- One accent for occasional emphasis.
Check combinations in context
Preview button, card, and text combinations before finalizing.
Adjust supporting colors if they overpower calls to action.
Useful for
- Designing marketing pages.
- Building UI tokens.
- Improving brand consistency across teams.
Support the main color, don't fight it
Secondary colors should make your brand tone clearer, not louder.