タイポグラフィをタイポグラフィたらしめるプロパティ

書体関係のデザイントークンを使用するときのコツ

書体指定時は以下の階層で考えると良いかも

元の方で設定

デザインシステムの基準となる

font-family

書体

font-smoothing

アンチエイリアス

font-feature-settings

カーニングなどの指定をする

color

デフォルトの色

vertical-align

デフォルトの上下位置

タイポグラフィ

各コンポーネントまたは各バリアントで指定する

font-size

大きさ

line-height

行間

letter-spacing

文字間隔

装飾的に使用

font-weight

太さ

text-decoration

下線など

text-transform

英字を大文字にする

color

上書きするときに指定

vertical-align

上書きするときに指定

おまけ

約物半角専用のWebフォント