Is declaring CSS variables in :root best practice?

I remember when I was learning other programming languages in college my professors would always tell me that global variables are taboo and should never be used. If I’m understanding correctly, declaring a CSS variable in :root makes it global right? However, in the Basic CSS: Inherit CSS Variables lesson it states that:

“To make use of inheritance, CSS variables are often defined in the :root element.”

Is this considered best practice for CSS or is there any other way I should be declaring my CSS variables?

a lot of the problems that a global variable could cause in a programming language dont really apply to css as its just a styling language, so i would say your pretty safe to use them in root, declaring them anywhere else would make them pretty useless tbh.

2 Likes