Placeholder text appears extra slanted

[Porlin]

Hi There,

While working on the CBM input, Oscar on the Flex UI Experience team noticed the placeholder font that's in italic appearing more slanted than in the designs.

Example: Flex on the left, Figma design on the right

We also noticed this on the Paste docs website

After talking to @loreina it looks like a browser issue.

Can you please let us know when the change is in so we can update it on our side?

[loreina]

Hey @Porlin, the slant level of the italicized text in Figma is accurate. We found a browser issue with how slants are applied to any italic, and have a ticket in the backlog to fix this. The team will follow up here when the changes has been made. Thanks for your patience!

[Porlin]

HI @loreina Do we have an estimate from the team when this will be resolved? We want to know if we can work on this ticket in the next sprint.

[loreina]

Hi @Porlin, your team can use the components as usual and upgrade the package version when the fix is out.

This is a browser issue and shouldn't be a firm blocker on your end. The slant we're seeing in some browsers is the actual default Inter slant, we were just trying to change the slant to an italicized angle we liked though now the change would require updating each instance where the italicized font is used.

We'll let you know here when the ticket is resolved. Thanks!

[SiTaggart]

Some background and context.

The angle you see in the browser is the default angle supplied by Inter, the typeface we currently use.

We are using the experimental variable font version where you get to change some aspects of the font rendering, and tried to lessen the italic angle as it's a bit much.

Browser support is hit and miss with experimental features, and an update to chromium and FF has regressed our implementation. It still works as expected in Safari. We treat experimental features of the web as progressive enhancement, where it's supported by a browser, and gracefully degrades where it is not supported.

It's also worth nothing that due to internationalization requirements at Twilio for this year, we are very likely changing the typeface in H1 of this year, which you'll get as a minor update in the future. So this issue just kind of goes away at that point.

[Porlin]

Hey @loreina and @SiTaggart Thank you for sharing this.

[gloriliale]

Hi @Porlin! Quick update on this: since the upcoming font change will resolve this browser-based issue, we'll be closing the ticket initially made from this discussion. Many thanks!