feature: CSS-like font fallback

[bsdayo]

Is your feature request related to a problem? Please describe.

Usually it's useful to mix two fonts in a single text element, as many asian fonts do not have nice-looking ASCII characters.

For example, font Noto Sans SC supports both ASCII and Chinese characters, but its ASCII characters... just not that good; while font Red Hat Display have nice-looking ASCII characters, but don't support Chinese characters. As for text 你好hello, we want the 你好 part in font Noto Sans SC, hello part in font Red Hat Display.

CSS font-family handles this scenario perfectly. Just a single line to achieve it:

font-family: 'Red Hat Display', 'Noto Sans SC', sans-serif;

If a character isn't supported by Red Hat Display, then fallback to Noto Sans SC; If still unsupported, then fallback to system sans-serif font.

It will benefit many people if this functionality can be implemented.

Describe the solution you'd like.

Add a fallback option to the font selector.

Describe alternatives you've considered.

No response

Additional context

No response

[bsdayo]

Well found that I can select all the ASCII pieces one by one and change their font, but obiviously it's is far away from convinence if there are a large amount of text to deal with. CSS behaivor is like "auto fallback".

[madalenapmelo-kp]

Hi @bsdayo,

Thanks for the suggestion! I have created an enhancement in our backlog on Taiga so that we can explore this in the future, details here: https://tree.taiga.io/project/penpot/issue/7603