文字
書体は Noto Sans JP Variable の一書体運用。日本語の可読性を最優先し、階層は書体でなくサイズとウェイトで作る。可変フォントなので font-weight は数値でそのまま指定できる。そして文字と同じくらい、ことばのトーンも UI の一部。
タイプスケール
text-2xl24px沖縄で働く、を面白く。ページタイトル
text-lg18px沖縄で働く、を面白く。セクション見出し
text-base16px沖縄で働く、を面白く。本文(長文)
text-sm14px沖縄で働く、を面白く。UI の基本サイズ。ボタン・フォーム・説明文
text-xs12px沖縄で働く、を面白く。バッジ・メタ情報・補足
UI の基本は text-sm。text-xl と text-3xl 以上は原則使わず、5段で完結させる。書体は増やさず、italic は日本語で崩れるため使わない。
ウェイト
Regular 400 — 本文と説明文Medium 500 — ラベル・ボタン・強調Semibold 600 — セクション見出しBold 700 — ページタイトル
トーン&ボイス
文言のルール。例文の型はそのまま流用してよい。
です・ます調。感嘆符は完了・祝福の場面だけ例: 応募が完了しました！
注意書きは ※ で前置きし、本文と分ける例: ※応募すると氏名が企業に公開されます。
空状態は「現状」+「次の一歩」の2文と CTA で構成する例: まだメッセージはありません / まずはプロフィールを充実させましょう
破壊的操作は必ず確認を挟み、取り消せないことを明記する例: 削除しますか？ この操作は取り消せません。
完了はトーストで短く伝える例: 一時保存しました。