Customize theme for Grafana 10 or 11

Grafana
1

Hi guys! Is it possible to add a custom theme like dark and light on Grafana 10 or 11?
I am using docker version now, but I don’t know how to nail it, though I try to modify sass files, but it cannot work. Some guys mentioned Boom theme or Astro Theme can help, but Boom theme is a deprecated plugin and Astro indeedly cannot support modifying themes. Can somebody provide an effective way to add or modify themes on docker environment or regular development environment? Thanks so much.

2

Hey @flyliu33

Well I’m quite sure that you can directly modify the json model. But this is no durable solution…

3

Hi, do you mean the dashboard json model? It seems to be some settings for plugins, datasource, or other components, but styles of current pages or dashboard. For my case, I want to change the size of some specific fonts, the color or image of the back whole dashboard background or background of specific plugins. Can you give me a simple example how to address it in json model? Thanks so much.

4

You may try to modify content of the following css files in public/build folder (XXXXX and YYYYY depend from Grafana version):

grafana.dark.XXXXX.css
grafana.light.YYYYY.css

5

Thanks