日目の記事になります。私はデザイナーとしての業務経験もあり、デザインの中でもフォントが好きです。デザインにおいてフォントはとても大切な要素で、デザインの質や効果を左右します。)についてお話します。Designでは一貫性を持たせるために、用途によって11種類のフォントスタイルを定義しています。つけることでスタイルを適用します。定義されているようです。カスタマイズする上記のスタイルはカスタマイズする事ができます!日本語用にするために、まずはカスタマイズ方法をドキュメントの例を元にご説明します。angular-material-typography($custom-typography);まずmat-typography-config関数にカスタマイズ内容を記述します。全体のfont-familyと13種類のスタイルをそれぞれ設定できます。全ての引数にはデフォルト値が設定されていますので、特に手を加える必要のないものは書かなくてOKです。続いて各スタイルを定義しているmat-typography-level関数です。こちらの引数とデフォルト値は下記の通りです。null最後に$custom-typographyを引数にangular-material-typographyを呼び出してスタイルを適用します。日本語用にカスタマイズする下記2点のカスタマイズを行います。変えるfont-sizeとline-heightを大きくするfont-familyは良いとして、2点目について少し説明します。いう、文字の密度が高いカテゴリに属しています。DesignではこのDanseに属する言語はフォントサイズが小さくなったとき(具体的には16px以下)に欧文で指定されているfont-sizeより1px大きくなります。line-heightはすべて欧文に比べて0.1em大きくします。具体的には下記のような設定になります。angular-material-typography($custom-typography);文字のコントラストこれは日本語だけではないですが、背景と文字コントラストが強すぎるとテキストが読みにくくなります。コントラストが強いというのは、明るい部分と暗い部分の差が大きいということです。初期状態の背景#ffffff・文字が#000000の場合はコントラストがとても強いので、ユーザーに優しくありません。Designでは文字と背景のコントラスト比についても言及されており、とくに明るい背景の場合は各スタイルに87%もしくは54%のopacityを適用します。styles.scssに追記しましょう。Materialを使うときはコンポーネントに目が行きがちですが、これを機にぜひTypographyも気にしてみてください。開発・運営している会社です。upLoginユーザーは見つかりませんでした。