Comments (6)
When variable fonts are not supported in the application (such as LibreOffice) the correct thing to do (per the OpenType specs) is to display the default master.
In Public Sans the default master is Thin.
So that is what you see.
Nothing wrong with the variable font.
LibreOffice users should use the static fonts.
from public-sans.
@kenmcd does Chrome on Windows not support variable fonts? I'm trying to use Public Sans with the Fontsource npm package and Gatsby, and Chrome reports the rendered font as Public Sans Thin
even when the text is bold:
This is the first time I'm trying to do much with custom web fonts, so I could be including it incorrectly. I'm using import "@fontsource/public-sans";
in the gatsby-browser.js
file, which seems to be the recommended way.
In any case, it was surprising to see the Thin variant being reported in Chrome when the weight was 700, which is how I ended up down this rabbit hole.
from public-sans.
@kenmcd does Chrome on Windows not support variable fonts?
Yes, Chrome on Windows does support variable fonts.
You can test Public Sans Variable in any Chromium-based browser here:
https://fonts.google.com/specimen/Public+Sans#type-tester
If I were you I would first use a very simple local test and get that working.
Then try to use some more complicated system later.
from public-sans.
Inspecting the rendered fonts on (most of) that Google Fonts page also shows Public Sans Thin
. But I noticed that the table of glyphs at the bottom shows Public Sans
. The difference seems to be that most of the text is styled with font-family: "Public Sans script=latin rev=1"
, but the latter uses "Public Sans script=all rev=1"
. (And on macOS Chrome, it's using "Public Sans script=all rev=2"
, while changing it to rev=1
defaults to Times.)
In the section showing the different weight samples ("Public Sans Medium", "Public Sans Bold", etc.), changing the script to all
does show the rendered fonts as Public Sans
, but causes the bolder samples to lose most of their weight. They become the same width as regular, but are slightly heavier.
From this comment:
When variable fonts are not supported in the application (such as LibreOffice) the correct thing to do (per the OpenType specs) is to display the default master.
In Public Sans the default master is Thin.
I was expecting that an app that does support variable fonts would therefore show the "correct" font name when it's displaying the "regular" weight, presumably Public Sans
. So either Chrome doesn't correctly support variable fonts, or the fonts applied to different scripts have different names, or... something else.
from public-sans.
From this comment:
When variable fonts are not supported in the application (such as LibreOffice) the correct thing to do (per the OpenType specs) is to display the default master.
In Public Sans the default master is Thin.I was expecting that an app that does support variable fonts would therefore show the "correct" font name when it's displaying the "regular" weight, presumably
Public Sans
. So either Chrome doesn't correctly support variable fonts, or the fonts applied to different scripts have different names, or... something else.
That is a different situation with desktop fonts, in a desktop application.
Which is what was discussed in the link in the first post above.
There may be an issue with the variable fonts used on the demo page.
The current version there is v1.007.
Public Sans is in the process of being updated on Google Fonts.
google/fonts#4656
That version has some changes and fixes in it.
That version is not yet live on Google Fonts (should be in a few days).
To test you should get the most recent fonts, and again, test locally first.
Get the most recent release, v2.001, here:
https://github.com/uswds/public-sans/releases
If that works then wait for the online fonts to update (which takes awhile).
If you cannot get local fonts to work, I do not know what you can do.
I test online variable fonts on Vivaldi (chromium-based) all the time.
from public-sans.
It looks like the local fonts included with the @fontsource npm package are v1.007, and were just downloaded from Google Fonts. That explains why I was seeing the same behavior on my site and GF.
Thanks for the detailed explanations! BTW, the v.2001 release .zip file includes __MACOSX
and .DS_Store
folders, in case that matters.
from public-sans.
Related Issues (20)
- Wrong weight on alternative `g` glyph HOT 3
- font-feature-settings, stylesets HOT 4
- Release is missiong the OFL.txt HOT 1
- "i" becomes "I" at start of every word HOT 4
- Public Sans - Bug: Update uswds compile to ^1.0.0-beta.3
- Public Sans - Feature: [add support for pinyin with tones]
- Awkward gap between capital A and lowercase m
- Remove Piece from Italic Character Latin Small Letter a with Ring Above: U+00E5 aring (å) HOT 1
- Feature request for a nerd font version HOT 2
- Subscript unicode values not set HOT 1
- Public-Sans: Create workflow to add triage label to all issues
- Public Sans - Bug: Some letters and sequences of DIN 91379 are rendered incorrectly.
- Public sans - Dependencies: Use node LTS 18
- Public-sans - Dependencies: Update python HOT 1
- Public Sans - Feature: single story lowercase "g" as an alternate glyph
- Public Sans - Feature: Consider making d, b, q, p distinct under reflection
- Public Sans - Feature: Additional stylistic sets for uppercase G
- The letter å becomes ǻ in italic
- Public Sans - Feature: Include variable woff2 files
- Public Sans - Feature: Update ruby & node version
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from public-sans.