Brand / Color
カラー
Synfortechで使う4色と、その使い方のルールです。中心になるのは、設立当初から使っているコーポレートカラー「Synfortech Blue（#00A1CC）」です。
パレット
Primary
Synfortech Blue
- HEX
- #00A1CC
- RGB
- 0, 161, 204
- CMYK
- 100, 21, 0, 20
Secondary
Deep Cyan
- HEX
- #007FA0
- RGB
- 0, 127, 160
- CMYK
- 100, 21, 0, 37
Dark
Ink Night
- HEX
- #0B0E14
- RGB
- 11, 14, 20
- CMYK
- 45, 30, 0, 92
Base
Pure White
- HEX
- #FFFFFF
- RGB
- 255, 255, 255
- CMYK
- 0, 0, 0, 0
使う場所
| 色 | 名前 | 使う場所 |
|---|---|---|
| #00A1CC | Primary — Synfortech Blue | ボタン、リンク、アイコン、アクセントの線 |
| #007FA0 | Secondary — Deep Cyan | ホバー時の色、補助的なボタン |
| #0B0E14 | Dark — Ink Night | 暗い背景、見出しの文字、フッター |
| #FFFFFF | Base — Pure White | 明るい背景、カードの地、暗い背景の上の文字 |
使い方のルール
-
01
Synfortech Blue はアクセントに使う
ボタン・リンク・アイコン・アクセントの線など、目を引きたい場所に使います。背景全体を塗る使い方は避けてください。
-
02
パレット以外の色をブランドカラーにしない
紫・赤・黄など、パレットにない色をブランドの代表色として使うことはできません。
-
03
文字と背景のコントラストを確保する
白い背景の上の文字は、グレー #6B7280 以上の濃さにします。文字が小さいほど、より高いコントラストが必要です。
背景ごとの組み合わせ
ボタン 白・明るい背景
スタンダードロゴを使います。Synfortech Blue はボタン・リンク・アイコンだけに使います。
暗い背景
スタンダードロゴを使い、Synfortech Blue をアクセントとして組み合わせます。
ブランドカラーの背景
文字とロゴは白にします。ホワイトロゴを使えるのは、この背景だけです。