seniorCSS
What does font-synthesis control?
Updated Apr 28, 2026
Short answer
It controls whether browsers are allowed to mathematically generate missing bold or italic font variations.
Deep explanation
If you load a custom font but only provide the 'regular' weight, and then apply font-weight: bold, the browser will try to fake it by artificially smearing the letters (faux bold). font-synthesis: none prevents this, ensuring typography remains true to the designer's intent.
Unlock with a Pro subscription to view this section.
View pricingReal-world example
No real-world example available yet.
Unlock with a Pro subscription to view this section.
Upgrade to ProCommon mistakes
No common mistakes listed yet.
Unlock with a Pro subscription to view this section.
Upgrade to ProFollow-up questions
No follow-up questions available yet.
Unlock with a Pro subscription to view this section.
Upgrade to Pro