Dashboards & Visualizations

How to set a background image to a panel?

Limey
New Member

I have tried everything i can think of ... this should work but i get nothing... any help would be greatly appreciated...

Here is my CSS

.dashboard-row .dashboard-panel div[id^="#panel1"] {
background-image: url("/static/app/xxx/blue-background.png") !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}

Labels (1)
Tags (2)
0 Karma

bzhivkova
Loves-to-Learn Lots

Hi, Limey,

Use the '.dashboard-body' and add inside the properties you want:

.dashboard-body{
background-image: url('/static/app/AppName/images/image.png');
background-repeat: no-repeat !important;
background-size: cover !important;
}

The result will be a stretched image on the whole dashboard as a background

Kind regards,
Boryana

0 Karma
Get Updates on the Splunk Community!

Splunk Observability for AI

Don’t miss out on an exciting Tech Talk on Splunk Observability for AI!Discover how Splunk’s agentic AI ...

Splunk Enterprise Security 8.x: The Essential Upgrade for Threat Detection, ...

Watch On Demand the Tech Talk on November 6 at 11AM PT, and empower your SOC to reach new heights! Duration: ...

Splunk Observability as Code: From Zero to Dashboard

For the details on what Self-Service Observability and Observability as Code is, we have some awesome content ...