形・影・動き

角の丸み

もの	丸み
ボタン・入力欄	6 px（rounded-md）
カード・まとまり	8 px（rounded-lg）
大きいタイル	12 px（rounded-xl）
下の島・シート	28 px
丸い印・アバター	まん丸（rounded-full）

一つの画面の中で、同じ種類の部品の丸みを変えないでください。

影

影はほとんど使いません。浮いているもの（下の島、シート、メニュー）だけに付けます。カードは影ではなく線（border）で区切ります。

ガラス

案内の部品（下の島・上の帯・シート）だけは、後ろが少し透ける「ガラス」にします。

項目	値
地（明るい表示）	白の 80%
地（暗い表示）	墨 950 の 80%
ぼかし	20 px、彩度 1.6 倍
縁	墨 200（暗い表示は墨 800）の 80%
影	0 8px 24px 12% と 0 1px 2px 8% の二重

• ガラスの上の文字は、後ろが真っ黒でも真っ白でも 4.5 : 1 以上の差が出る色にします。
• 端末の「透明度を下げる」設定のときは、透けない地にします。
• 本文やカードにはガラスを使いません。

動き

• 動きは「どこから来て、どこへ行ったか」を伝えるときだけに使います（例：シートが下から出る、0.25 秒）。
• 飾りの動き、流すと隠れる帯、点滅は使いません。
• 端末の「視差効果を減らす（動きを減らす）」設定のときは、動きを止めます。読み込み中の脈打つ表示も止めます。