如何使用 Google 字体使用可变字体的 3 个轴？
How do you use 3 axes of a variable font using Google Fonts?
我的目标是启用 Piazzolla variable font, served by Google Fonts. The 3 axes for Piazzolla are ital, wght, and opsz. If you are unfamiliar with optical sizing, there's a toggle on the Piazzolla specimen site 的光学尺寸轴来关闭和打开它。
现在，当您在 Google 字体上浏览可变字体时，许多功能和轴都被隐藏了。当您 select 获取导入代码的字体时，它不包含某些功能。一些轴丢失了。您必须阅读 Google css2 API documentation and the available axes 并尝试自己弄清楚。
关于它有一个 CSS Tricks article，但对于不同的字体，Recursive。我尝试使用一些示例，但要么 Piazzolla 字体无法加载，要么斜体字体无法加载，要么所有字重都无法加载。
这里有一个代码笔供大家使用：https://codepen.io/drw158/pen/BaZogRx
这是一个导入示例 url（没有 opsz 轴）：
https://fonts.googleapis.com/css2?family=Piazzolla:ital,wght@0,100..900;1,100..900&display=swap
您如何知道光学尺寸是否开启？如果您能够包含 opsz 轴和所有权重 (100–900) 的斜体负载，那么您可能已经解决了它。确保您没有在本地安装字体（或者您可以这样做以查看光学大小调整的样子）。
谢谢！
（我是 Google Fonts 的首席用户体验计划和运营经理，但我是以个人身份回答的；这不是公司的官方声明）
对我有用。这是您的笔叉，显示了在罗马和斜体上手动和自动设置的光学尺寸：
https://codepen.io/davelab6/pen/eYRJeqp
我用的字体APIURL是
https://fonts.googleapis.com/css2?family=Piazzolla:ital,opsz,wght@0,8..30,100..900;1,8..30,100..900&display=swap
我的猜测是您没有按字母顺序排列轴，或者您没有将 opsz 轴范围添加到罗马和斜体元组。
As explained in https://design.google/library/variable-fonts-are-here-to-stay/
Firefox DevTools 有一个优秀的可变字体交互式检查工具，所以如果您不确定您加载的字体中的轴是什么，您可以交互式地使用它们。
我的目标是启用 Piazzolla variable font, served by Google Fonts. The 3 axes for Piazzolla are ital, wght, and opsz. If you are unfamiliar with optical sizing, there's a toggle on the Piazzolla specimen site 的光学尺寸轴来关闭和打开它。
现在，当您在 Google 字体上浏览可变字体时，许多功能和轴都被隐藏了。当您 select 获取导入代码的字体时，它不包含某些功能。一些轴丢失了。您必须阅读 Google css2 API documentation and the available axes 并尝试自己弄清楚。
关于它有一个 CSS Tricks article，但对于不同的字体，Recursive。我尝试使用一些示例，但要么 Piazzolla 字体无法加载，要么斜体字体无法加载，要么所有字重都无法加载。
这里有一个代码笔供大家使用：https://codepen.io/drw158/pen/BaZogRx
这是一个导入示例 url（没有 opsz 轴）：
https://fonts.googleapis.com/css2?family=Piazzolla:ital,wght@0,100..900;1,100..900&display=swap
您如何知道光学尺寸是否开启？如果您能够包含 opsz 轴和所有权重 (100–900) 的斜体负载，那么您可能已经解决了它。确保您没有在本地安装字体（或者您可以这样做以查看光学大小调整的样子）。
谢谢！
（我是 Google Fonts 的首席用户体验计划和运营经理，但我是以个人身份回答的；这不是公司的官方声明）
对我有用。这是您的笔叉，显示了在罗马和斜体上手动和自动设置的光学尺寸：
https://codepen.io/davelab6/pen/eYRJeqp
我用的字体APIURL是
https://fonts.googleapis.com/css2?family=Piazzolla:ital,opsz,wght@0,8..30,100..900;1,8..30,100..900&display=swap
我的猜测是您没有按字母顺序排列轴，或者您没有将 opsz 轴范围添加到罗马和斜体元组。
As explained in https://design.google/library/variable-fonts-are-here-to-stay/
Firefox DevTools 有一个优秀的可变字体交互式检查工具，所以如果您不确定您加载的字体中的轴是什么，您可以交互式地使用它们。