Add Theme Color (updated)

Clicking this opens a pop-up within with a selection of items you can set specific colors for. By default these will be the colors used by the current theme.

Change Theme Color

Clicking on a theme color will select that specific color option.

Clicking on the preview color box will open a color picker allowing the color to be modified.

You can enter a HEX value and adjust its hue and transparency with the sliders by default.

When adding a color it may be fully transparent, just move the slider all the way to the right to make it fully opaque.

IMPORTANT

Any change to a theme level color or variable requires the Reapply Theme option be applied.

Although standard HEX color values are six characters long, you can have two additional characters (as a HEX value) in this option to set the color transparency. 00 would be fully transparent while FF would be fully opaque (although not required by default).

You can also use the RGBa color method, or the HSLa color method to enter the color (and adjust with the sliders as needed). Also to note, changing between color methods will automatically set the appropriate values for the color currently being used.

Please keep in mind not all colors are considered "web safe" although most will render very close to those supported by modern web browsers if there is not an exact match.

See W3 Schools CSS Legal Color Values for more in-depth details on color methods.