フォントの太さを指定するプロパティです。100から900までの数値、またはnormal、bold、lighter、bolderなどのキーワードで指定できます。可読性やデザイン上の強調表現に重要な役割を果たします。
font-weight: normal | bold | bolder | lighter | <number>| font-normal | font-weight: 400 |
| font-semibold | font-weight: 600 |
| font-bold | font-weight: 700 |
一般形: font-{weight}
任意値: font-[350]
サンプルテキスト
.element {
font-weight: 400;
}font-weight: 400;通常の太さ (400)
通常の太さ（normalと同じ）
font-weight: 700;太字 (700)
太字（boldと同じ）
font-weight: 300;細字 (300)
細字（light）
数値指定（100-900）の方が細かい制御が可能。Webフォントでは対応する太さのみ有効。
指定したウェイトがフォントに存在しない場合、ブラウザが機械的に太らせる「合成ボールド」になり、特に日本語フォントでは著しく汚くなります。AIはWebフォントの読み込みウェイトと指定ウェイトの対応を確認しないことが多いので、使うウェイトを読み込んでいるかをセットで確認してください。可変フォントなら100〜900の任意値が使えます。
このサイトで使っているfont-weightの値と、Webフォントで読み込んでいるウェイトの対応を監査して
そのままAIチャットに貼り付けて使える依頼文の例です。ページ上部の「AI用にコピー」でこのページ全体をコンテキストとして渡せます。