othermaciej
commented
2 weeks ago Is COLRv1 a standard? The links provided are to a Microsoft documentation page and a Google explainer repository.
Open o-t-w opened 1 month ago
othermaciej
commented
2 weeks ago Is COLRv1 a standard? The links provided are to a Microsoft documentation page and a Google explainer repository.
o-t-w
commented
1 week ago According to the 2024 edition of the Web Almanac, COLRv1 is already used on more websites than OpenType-SVG.
WebKittens
No response
Title of the proposal
COLRv1
URL to the spec
https://learn.microsoft.com/en-us/typography/opentype/spec/colr
URL to the spec's repository
https://github.com/googlefonts/colr-gradients-spec
Issue Tracker URL
No response
Explainer URL
No response
TAG Design Review URL
No response
Mozilla standards-positions issue URL
https://github.com/mozilla/standards-positions/issues/497
WebKit Bugzilla URL
No response
Radar URL
No response
Description
COLRv1 is a color font format that improves upon COLRv0 by adding support for gradients and blend modes, among other features.
Unlike other color font formats, COLR fonts can utilise the CSS font-palette property. COLRv1 also interacts well with the CSS font-variation-settings property.
Variable fonts have become popular on the web. Unlike other color font formats like OpenType-SVG, COLR fonts can be variable fonts.
In 2021, Safari's position on COLRv1 was negative. Many of the legitimate concerns and reservations Apple raised have since been rectified.
COLRv1 is supported by Firefox and Chrome/Edge/Samsung Internet.
Of the two most popular font creation tools:
From a typeface creation POV, I have created a variable COLRv1 font in FontLab and found it a fairly trivial process.
When it comes to design tools, COLRv0 is supported by the Affinity suite of apps and by Sketch app. Hopefully they will support v1 in the future. Figma supports neither OpenType-SVG or COLR.
We have started to see more COLRv1 fonts become publicly available, including many variable color fonts, which aren't possible with OpenType-SVG. See here for a somewhat comprehensive list. I currently count 20 well-designed and well-engineered publicly available COLRv1 fonts, most of them open source. This is good going for a font format that has only existed for a couple of years. While some of this is down to the patronage of Google Fonts, among professional type designers, excitement for this format is high.
On Windows 11, COLRv1 was used to implement emoji.
While it is possible to support all browsers by using both a COLRv1 font for Chromium and Firefox and a SVG font for Safari, this requires the font foundry to release the font in both formats, and requires slightly more knowhow and effort for developers to implement. The variety of color font formats is somewhat difficult to navigate for both font creators and frontend developers. Chromium have made it clear that they will not ever support OpenType-SVG.
One of the initial concerns expressed was "Supporting both OT-SVG and this new proposal is twice (-ish) the maintenance burden". Firefox have suggested they may eventually drop support for OpenType-SVG to avoid this issue:
Peter Constable's reply to WebKit's position in 2021 is here.
COLRv1 currently has 11 votes for Interop 2025.
Having exported color fonts myself from FontLab, COLRv1 has consistently delivered a significantly smaller file size compared to the same font exported as an OpenType-SVG. Smaller file sizes was the primary rationale for the creation of COLRv1. OpenType-SVG files were deemed by Google to be too large for use on the web. The OT-SVG version of Noto emoji was more than twice as large as the COLRv1 version.