Font weight not resolving correctly

[Zhong-z]

Bug report

Description / Observed Behavior

Not sure if it is Satori or the @vercel/og package, but setting different font weights does not change or update how the text is rendered. Tried it in both tw and normal styles.

Expected Behavior

the text with fontWeight:900 should look bolder

Reproduction

Using the verbal-og-example template, update the static page example or add a new page with fontWeight:900 style.

fontWeight:900

• source code: https://github.com/Zhong-z/vercel-og-nextjs/blob/main/pages/api/heavy-font.tsx
• deployment/image: https://vercel-og-nextjs-neon.vercel.app/api/heavy-font

fontWeight:100

• source code: https://github.com/Zhong-z/vercel-og-nextjs/blob/main/pages/api/static.tsx
• deployment/image: https://vercel-og-nextjs-neon.vercel.app/api/static

Additional Context

Satori version, and any other context about the problem here.

[david-buck]

As a workaround for this, I managed to get it working by overshooting the value I wanted; If I was having trouble getting bold text to show as semibold, instead of setting it at the specified 500, setting it at 450 worked.

[shuding]

Not sure if this is fixed by https://github.com/vercel/satori/pull/246 or not

[Zhong-z]

Not sure if this is fixed by #246 or not

I did looked at #246 prior raising the issue, should've mentioned it. The reproduction examples are using the latest (0.0.43) version as well, which includes #246 fix. However, I'm not sure was if the issue is coming from Satori or vercel/og as I couldn't find the vercel/og source code/repo.

[switz]

I can't seem to adjust any font weights on my og images either. Apologies for the +1, but it isn't clear if this is being worked on and I can't find the vercel/og repo like the parent comment.

[Zhong-z]

@shuding gentle bump. It seems there are more people having the same issue, judging from the number of 👍🏼 .

Perhaps updating the satori version in @vercel/og could help?

Please let me know if I could be help with anything to move this forward. 😃

[Zhong-z]

Updated the @vercel/og to the latest version (0.2.0) in the linked example in Reproduction, the issue unfortunately still exists.

[Zhong-z]

Updated the repo's @vercel/og to 0.4.1, issue still exists.

[shuding]

I just checked your reproduction carefully, and sorry for not mentioning this clearly: the @vercel/og package has only 1 built-in font (Noto Sans) with the 400 weight. If you need to use a different font or weight, you need to provide your own font.

The reasons that @vercel/og has only one font are:

• Fonts are licensed. The Satori library itself can't know or access to your system font files, so we can't have many options as built-in but let yourself providing the fonts.
• Fonts are large. Having too many built-in fonts will increase the library as well as the deployed function, and it's not possible to tree-shake unused fonts/weights away at build time.

So basically, the library only provides a small font for you to quickly develop and preview the image.