By default, simple-colors has the following 18 base colors: grey, red, pink, purple, deep-purple, indigo, blue, light-blue, cyan, teal, green, light-green, lime, yellow, amber, orange, deep-orange, brown, and blue-grey. Each color has 12 shades, those shades will vary based on theme and dark.
Your color will invert automatically when the dark attribute is set, by using the default-theme CSS variables, as in --simple-colors-default-theme-red-8. Or you can use the --simple-colors-fixed-theme-red-8 so that your color never inverts.
A box.
A box with dark attribute set.
You can let the color be determined contextually based on the accent-color attribute by using the accent CSS variables, as in --simple-colors-default-theme-accent-8. Or you can specifically name a color so that color stays the same, as in --simple-colors-default-theme-red-8.
A box with accent-color attribute set to cyan.
A box with accent-color dark attribute set and accent-color attribute set to cyan.