Dashboard themes. Colour names

Dashboard
1

Say I am using the dark theme.

The background colour is ...... what I call grey.

But that is a different grey to what I get when I use the colour name grey.

If I want things that match the background of the dark theme, how do I find the name of the colour used? Or at a push: The RGB value?
It would be nice if it was shown to the person somewhere in the edit window.

Going there I just see the theme selector and it shows dark, but no colours listed.

2

To get really specific colors use HTML hex color values, or RGB values. There is a wide variance on what 'named' colors are defined as, across various environments, browsers, etc. But HEX or RGB should improve how tight the color matching is.

Use a color picker....
https://html-color-codes.info/colors-from-image/

You can screen capture the dark theme, isolate the color, then feed image file of the color sample to the above web site, should get you to or very close to the HEX or RGB values.

1 Like
3

Thanks.
(extra characters to meet the needed 9 character minimum size)

4

Dev tools (but scanning github would work too).

Dark theme:

:root {
    --nr-dashboard-pageBackgroundColor: #111111;
    --nr-dashboard-pageTitlebarBackgroundColor: #097479;
    --nr-dashboard-groupTextColor: #0eb8c0;
    --nr-dashboard-groupBackgroundColor: #333333;
    --nr-dashboard-groupBorderColor: #555555;
    --nr-dashboard-widgetTextColor: #eeeeee;
    --nr-dashboard-widgetBackgroundColor: #097479;
    --nr-dashboard-widgetBorderColor: #333333;
    --nr-dashboard-widgetColor: #097479;
    --nr-dashboard-widgetBgndColor: #333333;
}

Light theme:

:root {
    --nr-dashboard-pageBackgroundColor: #fafafa;
    --nr-dashboard-pageTitlebarBackgroundColor: #0094CE;
    --nr-dashboard-groupTextColor: #1bbfff;
    --nr-dashboard-groupBackgroundColor: #ffffff;
    --nr-dashboard-groupBorderColor: #ffffff;
    --nr-dashboard-widgetTextColor: #111111;
    --nr-dashboard-widgetBackgroundColor: #0094ce;
    --nr-dashboard-widgetBorderColor: #ffffff;
    --nr-dashboard-widgetColor: #0094ce;
    --nr-dashboard-widgetBgndColor: #ffffff;
}
1 Like
5

Now that is just sneaky... looking at the code! LOL

1 Like
6

yeah - anyone would think this is open-source... pah.

1 Like