How do you add CSS to a dashboard?

[Puvi]

i have doubts like how to add a css file in splunk dashboard (internal external..)
please help me with that

[niketn]

@Puvi, Refer to one of my answers on three ways you can apply CSS to Splunk Simple XML Dashboards. It also lists how you can use your browser inspector tool to select DOM element and apply CSS style accordingly.

https://answers.splunk.com/answers/590387/how-do-i-update-panel-color-in-splunk-using-css-1.html

[niketn]

@Puvi, did you get a chance to try out my answer and explore CSS in Splunk Dashboard?

[harsmarvania57]

Hi @Puvi,

If you want to add css in your dashboard, you need to place your css file on splunk server in $SPLUNK_HOME/etc/apps/<APP NAME>/appserver/static/ and then you need to define that css in your dashboard xml like <dashboard .... stylesheet="YOUR_CSS_FILENAME.css">

[shailajasarangi]

Hi Harshil ,

Where to add the form tag in our xml code ? Can you please provide me one sample xml code . Will have some idea .

Thanks,
Shailaja

[niketn]

@shailajasarangi which form tag are you talking about? CSS can be applied to both <dashboard> and <form> views. @harsmarvania57 has already provided link to Splunk Dashboard Examples App from Splunkbase which has several examples of adding CSS and JS to your Splunk Dashboards.

You can also check out my answer below which has several ways of adding CSS to your Splunk Dashboard. You can also check out Splunk Documentation if you still have confusion. https://docs.splunk.com/Documentation/Splunk/latest/AdvancedDev/UseCSS

[Puvi]

thank you.. @harsmarvania57
yeah i have done that
i need further details regarding css like how to add background to an entire panel itself?

[harsmarvania57]

You can check custom layout in Splunk Dashboard Examples app (https://splunkbase.splunk.com/app/1603/) , here they have given below snippet in example.

/* EDIT PANELS */
.dashboard-panel input {
    background-color: #444;
}
.drag-handle a.delete-panel {
    background: #000 !important;
}

Are you looking for something like this?