CSS variable chapter two "how to override CSS variable" 🤹‍♂️

Hello dear folks 😉

In the last CSS variable chapter we have learned about how to create CSS variables and use them.

CSS variable first chapter!

🚩 Atul Prajapati 🇮🇳 ・ Mar 9 '21

#css #todayilearned #codenewbie #tutorial

In this post, we'll learn about "how to overriding variables"

In some cases, we need to make changes in CSS variable values at a certain level of our project, that's why we use this override feature.

Now imagine that we want to change our item card's headline and button color, so we'll use this code in our item selector.

.item {
    --red-color: green;
    background: var(--project-card-bg);
}

To clear your confusion look at this codepen project 👇

hmmm, that's it for this DEV post and in the next post, we will learn about the "Local CSS variable".

If you have any questions about CSS override you can comment below, i will reply asap ;)