> Version 1.0 — 美容・サロン(ヘアサロン・エステ・ネイル) > ターゲット:近隣エリアの30〜50代 / コンセプト:品質・素材へのこだわり
---
1. [Content Fundamentals](#1-content-fundamentals) 2. [Visual Foundations](#2-visual-foundations) 3. [Iconography](#3-iconography)
---
TAX は「素材への真摯な眼差し」を伝えるブランドである。テキストは普通体(だ・である調)で統一し、知的な落ち着きと編集誌的な信頼感を演出する。親しみやすさより正確さと品格を優先する。
| 項目 | ルール | |------|--------| | 文体 | 普通体(だ・である) | | リズム | 短文を基本とする。1文あたり最大60字を目安にする | | 語尾の繰り返し | 同一語尾の3連続は禁止(例:「〜である。〜である。〜である。」) | | 修飾語 | 形容詞の重複を避ける。「美しく上品な」ではなく「上品な」 | | 強調 | 太字のみ使用する。アンダーラインは使用しない |
---
| 主語 | 表記 | 禁止表記 | |------|------|---------| | ブランド自称 | TAX / 当サロン | 弊サロン・私ども・うち | | ユーザー呼称 | お客様 | あなた・ユーザー・皆さん・皆様 | | スタッフ呼称 | スタイリスト / 担当者 | スタッフ(単体使用は可)・先生 |
---
| 記号 | 可否 | 備考 |
|------|------|------|
| !(感嘆符) | ❌ 禁止 | キャンペーンバナーの見出しのみ例外的に1カ所まで許容 |
| ?(疑問符) | ⚠️ 要注意 | FAQ等の見出し用途のみ許容 |
| …(三点リーダー) | ✅ 許容 | 余韻・余白の演出として節度ある使用に限る |
| 絵文字 | ❌ 禁止 | SNS 投稿含むすべての媒体 |
| ハートマーク ♡ ♥ | ❌ 禁止 | — |
| ・(中黒) | ✅ 推奨 | 区切り・列挙に積極的に使用する |
---
| ケース | 表記 | 例 |
|--------|------|----|
| 価格・金額 | 半角数字 + 円 | 11,000円 |
| 時刻 | 半角数字 + コロン | 10:00 |
| 電話番号 | 半角ハイフン区切り | 03-0000-0000 |
| 施術時間(分) | 半角数字 + 分 | 90分 |
| 文章中の序数・助数詞 | 全角数字 | 三つのこだわり |
| 文章中の計量・具体数値 | 半角数字 | pH5.5 2名のスタイリスト |
| パーセント | 半角数字 + % | 20%OFF ※OFFは全角禁止 |
| 西暦年 | 半角数字 | 2025年 |
> 原則:計量・識別に用いる数字は半角。文章の流れに溶け込む序数・概念的な数は全角。
---
#### CTA(Call to Action)
| ✅ Do | ❌ Don't | |-------|---------| | 予約する | 今すぐ予約! | | 空き状況を確認する | クリック! | | カウンセリングを申し込む | お気軽にどうぞ | | 施術メニューを見る | もっと見る |
#### エラーメッセージ
| ✅ Do | ❌ Don't | |-------|---------| | 入力内容を確認されたい | エラーが発生しました | | 電話番号は半角数字で入力する | 無効な入力です | | この時間帯は予約を受け付けていない | NG | | 通信に失敗した。再度お試しいただきたい | Something went wrong |
#### 空状態(Empty State)
| ✅ Do | ❌ Don't | |-------|---------| | 現在、ご予約可能な枠はない | データなし | | 該当するメニューが見つからなかった | 0件 | | 予約履歴はまだない | Nothing here | | 検索条件を変えて再度お試しいただきたい | 空です |
#### 送料・料金補足
| ✅ Do | ❌ Don't | |-------|---------| | 施術料金はすべて税込表示である | 税込(税抜 ×,×××円) | | 別途、指名料が発生する場合がある | ※別途費用あり | | 初回カウンセリングは無料である | 0円! | | 材料費が追加になることがある | 材料費別途 |
#### キャンセル・変更ポリシー
| ✅ Do | ❌ Don't | |-------|---------| | 予約日の前日18時までにご連絡いただきたい | できるだけ早めに連絡ください | | 当日キャンセルは施術料金の50%を申し受ける | キャンセル料が発生します! |
#### お知らせ・告知
| ✅ Do | ❌ Don't | |-------|---------| | 春の新メニューを開始した | 春の新メニュー続々登場!! | | 年末年始の休業期間をお知らせする | お正月休みのお知らせ♡ |
#### ローディング・処理中
| ✅ Do | ❌ Don't | |-------|---------| | 送信中… | Please wait... | | 予約を確定している | 処理中です! |
---
最低8語の統一表記を定める。
| 概念 | 正式表記 | 禁止表記 | 備考 | |------|----------|---------|------| | 予約 | 予約 | ブッキング・booking・リザーブ | 英語混在禁止 | | カウンセリング | カウンセリング | カンセリ・相談(単独使用) | 初回カウンセリングと明記する | | 施術 | 施術 | トリートメント(和文中)・サービス | 英語媒体は "treatment" | | スタイリスト | スタイリスト | 美容師・先生・担当 | ネイル担当はネイリストと区別する | | ネイリスト | ネイリスト | ネイルスタッフ・ネイル師 | — | | メニュー | メニュー | コース・プラン(単独使用) | 「コース」はメニュー名の一部のみ使用可 | | お客様 | お客様 | お客さん・ゲスト・ユーザー | 二人称として使用する | | キャンセル | キャンセル | 取り消し・撤退 | 「キャンセル料」「キャンセルポリシー」は続けて使用する | | 空き状況 | 空き状況 | 在庫・残席・availability | — | | こだわり | こだわり | 拘り(漢字)・こだわり(ひらがな以外) | ひらがな固定 | | 素材 | 素材 | 材料・マテリアル(和文中) | 品質訴求の核心語 | | 税込 | 税込 | 税込み(送り仮名あり)・(税込)(括弧表記) | 括弧なし・送り仮名なし |
---
#### カラーパレット
``css
:root {
/* ── Base Neutrals ── */
--color-paper: #f5f4f2; /* ページ背景。温かみのある白 */
--color-paper-deep: #eceae6; /* セクション区切り・入力背景 */
--color-surface: #ffffff; /* カード・モーダル表面 */
--color-ink: #1a1a1e; /* 本文・見出し */
/* ── Ink Opacity Scale ── */ --color-ink-06: rgba(26, 26, 30, 0.06); /* ホバー背景・テーブル縞 */ --color-ink-12: rgba(26, 26, 30, 0.12); /* ボーダー・区切り線 */ --color-ink-24: rgba(26, 26, 30, 0.24); /* 補助テキスト(淡) */ --color-ink-40: rgba(26, 26, 30, 0.40); /* プレースホルダー */ --color-ink-60: rgba(26, 26, 30, 0.60); /* キャプション・補足 */ --color-ink-80: rgba(26, 26, 30, 0.80); /* サブ見出し */ --color-ink-100: rgba(26, 26, 30, 1.00); /* フルインク */
/* ── Accent(寒色:スチールブルー) ── */ --color-accent: #4a6c8c; /* プライマリCTA・リンク・アクティブ */ --color-accent-dark: #2d4f6e; /* ホバー・プレス時 */ --color-accent-soft: #c2d4e4; /* バッジ背景・タグ・薄いハイライト */
/* ── Semantic ── */
--color-success: #3a7d5e;
--color-warning: #b07a2a;
--color-danger: #9b3a3a;
--color-info: #3a5f8a;
}
`
#### 配色ルール
| レイヤー | 使用色 | 用途 |
|----------|--------|------|
| ページ背景 | --color-paper | 全ページの最底面 |
| セクション背景 | --color-paper-deep | 交互セクション・フォーム背景 |
| コンポーネント表面 | --color-surface | カード・モーダル・ドロップダウン |
| 本文テキスト | --color-ink-100 | H1〜H3・本文 |
| 補足テキスト | --color-ink-60 | キャプション・日付・タグ |
| プライマリアクション | --color-accent | CTAボタン・選択状態・リンク下線 |
| ホバー | --color-accent-dark | アクセントカラー使用箇所全般 |
| 薄いアクセント | --color-accent-soft | バッジ・タグ・インフォバナー背景 |
#### アクセントカラーの用途制限
- 使用してよい箇所:CTAボタン・テキストリンク・アクティブなナビゲーション・フォームフォーカスリング・バッジ
#### 禁止事項
`
---
2-2. タイポグラフィ(Typography)
#### 書体スタック
`css
--font-sans: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
--font-serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
--font-mono: "JetBrains Mono", "Courier New", monospace;
`| 役割 | 書体 | 主な使用箇所 |
|------|------|------------|
| ディスプレイ見出し |
--font-serif | H1・キャッチコピー・トップビジュアル |
| セクション見出し | --font-serif | H2・H3 |
| 本文・UI | --font-sans | 本文・ラベル・ボタン・フォーム |
| コード・数値列 | --font-mono` | 価格表の整列・コード表示 |> 方針:エディトリアル(雑誌風)の美意識を体現するため、見出しには明朝体(serif)を積極的に採用する。本文は