CSS Properties and Values API
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.
Interfaces
CSS.registerProperty
-
Defines how a browser should parse a
CSS custom properties
. Access this interface throughCSS.registerProperty
in JavaScript. @property
-
Defines how a browser should parse a
CSS custom properties
. Access this interface through@property
at-rule in CSS.
Examples
The following uses CSS.registerProperty
in JavaScript to type a CSS custom properties
, --my-color
, as a color, give it a default value, and not allow it to 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;
}
Specifications
No specification found
No specification data found for api.CSS.registerProperty
.
Check for problems with this page or contribute a missing spec_url
to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.
Browser compatibility
BCD tables only load in the browser