Yeah, definitely. I have all of my colours in a custom css theme which I then reference the variables from my Perspective Styles. Using a CSS theme will then allow you to easily create alternate theme such as light, dark, colourblind, high-contrast, etc. in the future. Have a read of the readme.md inside the theme folder in the ignition data directory:
C:\Program Files\Inductive Automation\Ignition\data\modules\com.inductiveautomation.perspective\themes
You can reference css variables with:
var(--<VARIABLE_NAME>) for example:
var(--neutral-20) which is part of the light theme. You can use this in any property’s value, but obviously if it’s a colour, it won’t make sense to use in a non-colour property… You can put anything into a variable though, such as widths for certain things like standardised margins between certain components:
Using these inside Perspective Styles then lets you standardise the look and feel of your various ui elements instead of having to reference a number of css variables and other css styling for each component.
When applying P.styles to components, you just add them as a space-separated list into the relevant styles.classes property