base-palette
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since November 2022.
Der base-palette CSS Deskriptor wird verwendet, um den Namen oder Index einer vordefinierten Palette festzulegen, die zur Erstellung einer neuen Palette verwendet werden soll. Wenn die angegebene base-palette nicht existiert, wird die Palette mit dem Index 0 verwendet.
Syntax
@font-palette-values --one {
base-palette: 1;
}
Der base-palette Deskriptor wird mit einem nullbasierten Index der vom Schriftgestalter erstellten Paletten angegeben.
Werte
<index>-
Gibt den Index der zu verwendenden vordefinierten Palette an.
Formale Definition
| Zugehörige @-Regel | @font-palette-values |
|---|---|
| Anfangswert | n/a (required) |
| Berechneter Wert | wie angegeben |
Formale Syntax
base-palette =
light |
dark |
<integer [0,∞]>
Beispiele
>Ändern der Standard-Palette in einer Schriftart
Dieses Beispiel zeigt anhand der Rocher Color Font zwei Instanzen, bei denen die Standard-Palette in der Schriftart zu einer vom Schriftgestalter erstellten alternativen Palette gewechselt wird.
HTML
<h2>default base-palette</h2>
<h2 class="two">base-palette at index 2</h2>
<h2 class="five">base-palette at index 5</h2>
CSS
@font-face {
font-family: "Rocher";
src: url("[path-to-font]/RocherColorGX.woff2") format("woff2");
}
h2 {
font-family: "Rocher", fantasy;
}
@font-palette-values --two {
font-family: "Rocher";
base-palette: 2;
}
@font-palette-values --five {
font-family: "Rocher";
base-palette: 5;
}
.two {
font-palette: --two;
}
.five {
font-palette: --five;
}
Ergebnis

Spezifikationen
| Specification |
|---|
| CSS Fonts Module Level 4> # base-palette-desc> |
Browser-Kompatibilität
Loading…
Siehe auch
@font-palette-valuesfont-familyDeskriptoroverride-colorsDeskriptorfont-paletteEigenschaftCSSFontPaletteValuesRule.basePalette