CSS Fonts 4

on YouTube ↗40m

" summary

Web use of web fonts jumps to about 70–75% of sites and CSS Fonts 4 delivers concrete tools: variable fonts single-file axes that let one download a single font and interpolate weights (now numeric 1–99), font-palette + @font-palette-values to override color palettes, and COLR/CPAL or SVG-based color glyphs with format() supports() fallbacks. It shows browser controls like font-synthesis and font-kerning, demos of animated axes, and the Wakamai Fondue inspector to reveal supported OpenType features.

AI-written summary · about

" chapters (10)

1. 0:00Introduction
2. 1:51Font terminology basics
3. 9:07Variable fonts benefits
4. 13:43Variable font properties in CSS
5. 20:33Color fonts use cases
6. 23:45Color fonts styling with CSS font palette
7. 28:16Color fonts in web development
8. 29:20OpenType features in CSS
9. 37:14Testing font features with Wakamai Fondue
10. 39:04Q&A

" related talks

• 38mWebfonts in 2019: Everything changesChris Lilley · Frontend United 2019
• 29mThe State of WebFontsChris Lilley · View Source 2017
• 32mAre variable fonts the future of web typography?Bram Stein · CSS-Minsk-JS 2018
• 31mFontastic web performanceMonica Dinculescu · JSHeroes 2018
• 19mVariable Fonts and the Future of Web DesignMandy Michael · dotCSS 2018
• 45mOnce Upon a Drop Cap: A Look at Typography as UXJason Pamental · Web Unleashed 2016
• 36mVariable Fonts and Dynamic Typography with CSSJason Pamental · Web Unleashed 2018
• 33mVariable Fonts: WTF?Bianca Berning · Pixel Pioneers Bristol 2022