Arrows not working on the web with Google Fonts
Problem description
When using the font through google fonts on the web, the arrows will not display as this font's characters.
Expected behavior
The arrows should use the characters from this font
Screenshots
To Reproduce
I've made a codepen that shows this issue: https://codepen.io/mattmcadams/pen/mdgdKZL
Environment (please complete the following information):
- OS: MacOS 13.5.1
- Browser: Firefox Dev Edition 124.0b3
- Fonts: Google fonts? I'm not sure
Additional context
I've tried passing the actual arrow characters into my code → and ← and using the ← and → sequences.
My CSS looks like this:
@import url('https://fonts.googleapis.com/css2?family=Recursive:slnt,wght,CRSV,[email protected],300..800,0..1,0..1&display=swap');
body {
font-family: 'Recursive', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
I've tried to search around for an answer but I've come up empty, but I haven't tried self-hosting the font yet, so I'll try that next.
I don't know if this is a legitimate bug or if there are extra steps I need to do to get these characters. Thanks for any assistance, and thanks for the incredible typeface!
I changed the title because self hosting the font has the correct arrows. Seems to just be a problem with the version on google fonts?
Google Fonts subsets fonts to limit their size by excluding less common characters. The arrows were probably cut out in that process. I don’t think it’s a problem in Recursive, so I’ll close this.
This issue seems relevant: https://github.com/google/fonts/issues/4820