(re-sending from @chromium.org account)
Contact emailsdr...@chromium.org
rshee...@google.com

Specificationhttps://www.w3.org/TR/css-fonts-4/#propdef-font-palette

Summary

The font-palette CSS property allows selecting a palette from a color font.
In combination with the @font-palette-values at-rule, custom palettes can
be defined. Use cases: designs where an icon or emoji font is used in
combination with dark or light mode, or multi-colored icon fonts that are
colorised using font-palette to harmonise with the content's color scheme.
font-palette increases efficiency of color font uses, as no server
roundtrip is needed for changing the colors of the font.

Blink componentBlink>Fonts
<https://bugs.chromium.org/p/chromium/issues/list?q=component:Blink%3EFonts>

Search tagspalette <https://chromestatus.com/features#tags:palette>,
font-palette <https://chromestatus.com/features#tags:font-palette>, color
<https://chromestatus.com/features#tags:color>, colr
<https://chromestatus.com/features#tags:colr>, cpal
<https://chromestatus.com/features#tags:cpal>, animation
<https://chromestatus.com/features#tags:animation>

TAG reviewSafari ships this in beta, smaller CSS feature closely belonging
to effective vector color font usage (COLR, COLRv1), the latter being
available for quite a while.

TAG review statusNot applicable

Risks


Interoperability and Compatibility

Very low, available in Safari technology preview and tested with over 50
WPT tests, all pasing. Developed in code and spec updates in close
collaboration with Myles Maxfield who implemented font-palette support for
Safari TP.


Gecko: Under consideration (
https://github.com/mozilla/standards-positions/issues/617) Position
requested in above link, tracking bug exists:
https://bugzilla.mozilla.org/show_bug.cgi?id=1461588

WebKit: Positive (
https://developer.apple.com/documentation/safari-release-notes/safari-15_4-release-notes)
Feature complete, available in Safari 15.4 Beta and technology preview

Web developers: Positive, Internal feedback and request from Google Fonts
and Material design for extending flexibility and colorisation options of
Material Icons font. Type designers already polyfilling such functionality
with server round-trips, compare:
https://underware.nl/fonts/plakato/features/color/

Other signals:

Ergonomics

If font-palette and @font-palette-values are used heavily for animation,
this might be heavy on page rendering performance, as it currently
invalidates fonts and triggers a relayout. Should this turn out to be an
important use-case, a more optimized invalidation is possible, in which we
could aim to not touch layout, but only redraw glyphs with changed
palettes. That's possible because a palette change does not trigger a font
metrics change, as opposed to a change to font variation parameters for
example.


Activation

Server side round trips to retrieve fonts with changed palette from the
server are possible. Other than that: The feature degrades gracefully, as
glyphs will still be visible, just with the default palette, not with the
author palette.


Security

Engine-internal CSS feature, new code consists of CSS parsing code and
added functionality in Skia to select colors not directly from font but
from user-supplied font. Same bounds checks as before, I do not see an
increased security risk.


Debuggability

font-palette debuggable as usual as a regular CSS property in DevTools.
@font-palette-values editable through editing the CSS content in DevTools
but no extra tooling exists for selecting colors or pre-filling a palette
with values from the font for example. This could be a possible extension
if it turns out to be a popular requested use case.


Is this feature fully tested by web-platform-tests
<https://chromium.googlesource.com/chromium/src/+/master/docs/testing/web_platform_tests.md>
?Yes, extensively tested, test list
<https://wpt.fyi/results/css/css-fonts?label=master&label=experimental&aligned&q=palette>

Flag nameAvailable under experimental web platform features in Canary from
101.0.4931.0.

Requires code in //chrome?False

Tracking bughttps://bugs.chromium.org/p/chromium/issues/detail?id=1170794

Sample links
Plakato Color Grade (currently polyfilled):
https://underware.nl/fonts/plakato/features/color/
<https://chromestatus.com/admin/features/launch/5674031696052224/Plakato%20Color%20Grade%20(currently%20polyfilled):%20https://underware.nl/fonts/plakato/features/color/>

Estimated milestones

No milestones specified


Link to entry on the Chrome Platform Status
https://chromestatus.com/feature/5674031696052224

This intent message was generated by Chrome Platform Status
<https://chromestatus.com/>.

-- 
You received this message because you are subscribed to the Google Groups 
"blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to blink-dev+unsubscr...@chromium.org.
To view this discussion on the web visit 
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAN6muBs1A0rz1iTffBJj3S2uy2w8dUn6Ey%2B91K9_hBhXvNL5jQ%40mail.gmail.com.

Reply via email to