On macOS, for some reason, the sans-serif font (which I think resolves to Helvetica) will always render certain emojis in monochrome form, even when the emoji character has the emoji presentation sequence (0xFE0F).

I often have sans-serif as the last fallback font in my styles, but this is causing problems in Chrome when rendering emojis because now some emojis will not render in color.

This only happens in Chrome; Firefox and Safari render the emojis correctly in color.

Is this a Chrome bug? How can I fallback to the default sans-serif font while preserving color emojis?

<table>
  <tr><td>default:</td><td>foo ☹️</td></tr>
  <tr><td>serif:</td><td style="font-family: serif">foo ☹️</td></tr>
  <tr><td>sans-serif:</td><td style="font-family: sans-serif">foo ☹️</td></tr>
</table>

Chrome screenshot:

Firefox screenshot:

• Chrome 97.0.4692.71
• macOS 12.1

Edit: This issue may be relevant: Issue 964527: Chrome often ignores emoji and text variation selectors U+FE0F and U+FE0E