GeezerVison is showing developer.mozilla.org — CSS Properties and Values API - Web APIs | MDN
CSS Properties and Values API
Baseline 2024
Newly available
Since July 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
The CSS Properties and Values API — part of the CSS Houdini umbrella of APIs — allows developers to explicitly define their CSS custom properties, allowing for property type checking, default values, and properties that do or do not inherit their value.
The following will register a custom property named --my-color using CSS.registerProperty in JavaScript. --my-color will use the CSS color syntax, it will have a default value of #c0ffee, and it will not inherit its value:
js
window.CSS.registerProperty({
name: "--my-color",
syntax: "<color>",
inherits: false,
initialValue: "#c0ffee",
});
The same registration can take place in CSS using the @property at-rule:
css
@property --my-color {
syntax: "<color>";
inherits: false;
initial-value: #c0ffee;
}