CSS Properties

font-weight

CSS property · 15 supported, 6 partial, 0 unsupported across 21 clients

font-weight splits the field: 15 full, 6 partial of 21 clients as of Sep 2, 2026, the partials (Outlook (New), Outlook Classic, Yahoo Mail) are where sends go wrong.

5/7 webmail, 4/6 desktop, 6/8 mobile clients support font-weight fully.
Partial in Outlook (New), Outlook Classic, Yahoo Mail, Yahoo Mail Android and 2 more, behavior differs from browsers, test before relying on it.
Outlook Classic (Word engine, supported to at least 2029) does not fully support font-weight, and its replacement changes little here; see the deprecation diff.
Across all clients, only 6 of 298 tracked HTML/CSS features render identically everywhere.

Source: caniemail.com (MIT), via the Emailens engine. Last tested upstream Jun 23, 2022, synced by Emailens Sep 2, 2026.

font-weight selects the boldness of rendered text. While numeric weights (100–900) and keywords (normal, bold) are universally accepted, clients fall back to the closest weight available in the actual rendered font, so a 300 weight may display the same as 400 if the font family lacks a light cut.

Client Support

Client	Category	Engine	Support
Gmail	webmail	Gmail Web	Supported
Gmail Android	mobile	Gmail Mobile	Supported
Gmail iOS	mobile	Gmail Mobile	Supported
Outlook 365	webmail	Outlook Web	Supported
Outlook (New)	desktop	Outlook Web	Partial^{See caveat 1}
Outlook Classic	desktop	Microsoft Word	Partial^{See caveat 1}
Outlook iOS	mobile	Outlook Mobile	Supported
Outlook Android	mobile	Outlook Mobile	Supported
Outlook for Mac	desktop	WebKit	Supported
Apple Mail	desktop	WebKit	Supported
Apple Mail iOS	mobile	WebKit	Supported
Yahoo Mail	webmail	Yahoo	Partial^{See caveat 2}
Yahoo Mail Android	mobile	Yahoo	Partial^{See caveat 2}
Yahoo Mail iOS	mobile	Yahoo	Partial^{See caveat 2}
Samsung Mail	mobile	Samsung	Supported
Thunderbird	desktop	Gecko	Supported
HEY Mail	webmail	WebKit	Supported
Proton Mail	webmail	Proton	Supported
AOL Mail	webmail	AOL	Partial^{See caveat 2}
Fastmail	webmail	Fastmail	Supported
Superhuman	desktop	Blink	Supported

Documented caveats (2)

1.Outlook (New), Outlook Classic: Partial support. <number> values between 0 and 599 are set as normal font weight. <number> values between 600 and 1000 are set as bold font weight.
2.Yahoo Mail, Yahoo Mail Android, Yahoo Mail iOS, AOL Mail: Partial support. <number> values are not supported as per CSS Fonts Level 4 where any <number> value between 1 and 1000 (inclusive) is a valid value. Only the following numeric values are supported: 100, 200, 300, 400, 500, 600, 700, 800, and 900.

Caveats recorded by caniemail.com (MIT) and carried verbatim, one entry per wording rather than per client.

Client-by-client behaviour for font-weight

Fully supports font-weight (15): Gmail, Gmail Android, Gmail iOS, Outlook 365, Outlook iOS, Outlook Android, Outlook for Mac, Apple Mail, Apple Mail iOS, Samsung Mail, Thunderbird, HEY Mail, Proton Mail, Fastmail, Superhuman.

Partial support (6): Outlook (New), Outlook Classic, Yahoo Mail, Yahoo Mail Android, Yahoo Mail iOS, AOL Mail. Expect rendering quirks unique to each engine. Partial support typically means a subset of values, an ignored shorthand, or sanitizer-specific rewrites.

When to use font-weight in email

Distinguishing headings from body copy without changing font family.
Emphasizing inline content (offer codes, names, dates) inside paragraph text.
Pairing display weights with system fallback fonts in cross-platform templates.

Rendering behaviour and edge cases

If you load a custom font with @font-face, weights other than what you've actually loaded will not render , they fall back to system fonts at the closest weight.
Outlook on Windows can substitute Calibri Light for any 300-weight declaration, sometimes producing visibly different geometry.
Some clients render bold differently when the parent <strong> already provides bolding, leading to faux-bold doubling.

Recommended fallback strategy

Stick to a small set of widely supported numeric weights (400, 600, 700) and ensure the corresponding cuts are loaded with @font-face when using a custom font. Avoid mixing <strong> with explicit font-weight: bold on the same element to prevent double-bolding.