any plan to support unicode-range on next/font/google ?
#47309
Replies: 8 comments 3 replies
-
|
I would also like to see this happen! |
Beta Was this translation helpful? Give feedback.
-
|
You might not need import { Noto_Sans_Arabic, Roboto } from 'next/font/google'
const roboto = Roboto({
weight: ['400', '500', '700'],
subsets: ['latin'],
})
const notoSansArabic = Noto_Sans_Arabic({
subsets: ['arabic'],
display: 'swap',
adjustFontFallback: false,
})You can then load both fonts. The browser will fill in all chinese characters with the first font, then use the second font for the latin characters. |
Beta Was this translation helpful? Give feedback.
-
|
I tried your approach but most fonts don't seem to support subsets of multiple languages. They only have "latin" and "latin-ext". |
Beta Was this translation helpful? Give feedback.
-
|
This helped immensely! Thanks so much! |
Beta Was this translation helpful? Give feedback.
-
|
OMG, finally. I have been searching a lot for a solution. don't know why this is not common on search results |
Beta Was this translation helpful? Give feedback.
-
|
I gave up on using nextjs font, and just went with custom font-face. @font-face {
font-family: "CustomFont";
src: url("/fonts/NanumGothic-Regular.ttf") format("truetype");
font-style: normal;
}
@font-face {
font-family: "CustomFont";
src: url("/fonts/Karla-Medium.ttf") format("truetype");
font-style: normal;
unicode-range: U+0041-005A, U+0061-007A;
}I added the above code to <html>
<body className={`font-[CustomFont]`}>{children}</body>
</html>I will update this post when I make this font face to act like the nextjs font. |
Beta Was this translation helpful? Give feedback.
-
|
I would like to have this support as well. We have applications with CJK language supports. |
Beta Was this translation helpful? Give feedback.
-
|
There is another workaround: https://www.reddit.com/r/nextjs/comments/12p94t6/how_do_i_add_multiple_fonts_using_nextfont/ |
Beta Was this translation helpful? Give feedback.
-
|
This would be great to see for the case where you want to use text characters from one family and unicode characters like ® from another font family. We're trying to solve an issue right now where our ® is too large in our default font family.
|
Beta Was this translation helpful? Give feedback.
-
|
Any support for this so far?? |
Beta Was this translation helpful? Give feedback.
-
|
Any updates/solutions? Existing solutions feel hacky. |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
-
Goals
i am sorry for my bad english， i used google translate my words
I want to set different fonts for different texts, such as using Jost font for English and Noto Sans SC font for Chinese.
here is my code
Non-Goals
Background
I want to set different fonts for different texts, such as using Jost font for English and Noto Sans SC font for Chinese.
Proposal
i have no idea
Beta Was this translation helpful? Give feedback.
All reactions