How to change or override primary color in Ionic 5?

Hi all,

Having a hard time to change:


root {
  /** primary **/
  --ion-color-primary: #3880ff;
  --ion-color-primary-rgb: 56, 128, 255;
  --ion-color-primary-contrast: #ffffff;
  --ion-color-primary-contrast-rgb: 255, 255, 255;
  --ion-color-primary-shade: #3171e0;
  --ion-color-primary-tint: #4c8dff;

in the variables.scss in Ionic 5. Whatever I do, I can’t change or override the primary color. Is this a known issue or am I doing something wrong here?

Nobody who can help?

In the way you are using it, the pseudo-selector :root really needs a leading colon.

What do you mean with a ‘leading colon’? Can you give an example? What am I doing wrong?

:root, not root.

Correct! Thanks, rapropos. I have found the issue anyway.

The reason it was not changing the color, is because I was in dark mode and the stylesheet for dark mode is different than the light mode. Fixed!