CODEWITHSUNDEEP
htmlcss
Epple
Epple

Reputation: 972

CSS Variables not work with custom property fallback values

I am declaring a custom property in :root like below, but my color not work for me. What I am wrong?

:root {
    --color-primary: var(--color-primary, #ffc107);
}
body {
    background-color: var(--color-primary); // background color not work
}

Upvotes: 2

Views: 479

Answers (3)

Florin Matei
Florin Matei

Reputation: 51

you need to declare the variable in :root like this:

:root {
    --color-primary: #ffc107;
}

Upvotes: 3

Rakesh IBS
Rakesh IBS

Reputation: 11

Use like as

:root {--color-primary: #ffc107;} body {background-color: var(--color-primary);}

Upvotes: 1

Omar Atri
Omar Atri

Reputation: 240

Declaring css variables should be like this:

:root {
    --color-primary: #ffc107;
}
body {
    background-color: var(--color-primary);
}

Upvotes: 2

Related Questions