Check out example codes for "css custom properties". It will help you in understanding the concepts better.

Code Example 1

/* create */
:root {
	--variable-name: variable-property;
}
/* use */
selector {
	property: var(--variable-name);
}

Code Example 2

Values in JavaScript
To use the values of custom properties in JavaScript, it is just like standard properties.
// get variable from inline style
element.style.getPropertyValue("--my-var");

// get variable from wherever
getComputedStyle(element).getPropertyValue("--my-var");

// set variable on inline style
element.style.setProperty("--my-var", jsVar + 4);

Code Example 3

:root {
  --main-bg-color: pink;
}
body {
  background-color: var(--main-bg-color);
}

Learn ReactJs, React Native from akashmittal.com