What are some examples of CSS custom properties?

What are some examples of CSS custom properties?

CSS custom properties, also known as CSS variables, allow you to store values that can be reused throughout your stylesheet. For example, you can define a color variable like this: --main-color: #3498db;.

Can you show me how to use that variable in a style?

Sure! You can use the variable in your styles like this: color: var(--main-color); This will apply the main color to the text.

What if I want to change the value of the variable later?

You can easily change the value of the variable in one place, and it will update everywhere it's used. For example, if you change --main-color: #e74c3c;, all elements using var(--main-color) will update to the new color.

Are there any limitations to using CSS custom properties?

CSS custom properties are supported in all modern browsers, but they don't work in Internet Explorer. Also, they can only be used in the context of the DOM, meaning they can't be used in media queries or other CSS at-rules.