font-palette-values

Правило @font-palette-values ​​позволяет настроить значения по умолчанию для палитры шрифтов, созданной создателем шрифта.

Синтаксис

@font-palette-values --identifier {
    font-family: Bixa;
}
.my-class {
    font-palette: --identifier;
}

<dashed-ident> — это определяемый пользователем идентификатор, который, хотя и выглядит как пользовательское свойство CSS, ведет себя по-другому и не заключен в функцию CSS var().

Дескрипторы

font-family

Задает имя семейства шрифтов, к которому можно применить эту палитру.

base-palette

Задает имя или индекс базовой палитры, созданной создателем шрифта для использования.

override-colors

Задает цвета в базовой палитре для переопределения.

Спецификация

• CSS Fonts Module Level 4

Пример

В этом примере показано, как можно изменить некоторые или все цвета цветного шрифта.

HTML

<p>default colors</p>
<p class="alternate">alternate colors</p>

CSS

@import url(https://fonts.googleapis.com/css2?family=Bungee+Spice);
p {
    font-family: 'Bungee Spice';
    font-size: 2rem;
}
@font-palette-values --Alternate {
    font-family: 'Bungee Spice';
    override-colors:
        0 #00ffbb,
        1 #007744;
}
.alternate {
    font-palette: --Alternate;
}

Результат:

Комментарии