# How to apply custom css in Kibana UI

**URL:** https://discuss.elastic.co/t/how-to-apply-custom-css-in-kibana-ui/37434
**Category:** Kibana
**Created:** [December 17, 2015, 6:14am UTC](https://discuss.elastic.co/t/how-to-apply-custom-css-in-kibana-ui/37434 "2015-12-17T06:14:42Z")
**Posts on this page:** 1
**Showing post:** 5

<div class="post-metadata">

### Author: ![9owe8](https://avatars.discourse-cdn.com/v4/letter/9/b782af/32.png) [@9owe8](https://discuss.elastic.co/u/9owe8)
#### Post date: [April 21, 2017, 6:36am UTC](https://discuss.elastic.co/t/how-to-apply-custom-css-in-kibana-ui/37434/5 "2017-04-21T06:36:07Z")

</div>

Hi Joe, thanks for clarification.

some code snippets for kibana 5 plugin, which change CSS:

**index.js**

```
export default function (kibana) {
return new kibana.Plugin({
id: 'hugo_kibana_plugin',
require: ['kibana', 'elasticsearch'],
uiExports: {
  hacks: [
    'plugins/hugo_kibana_plugin/hack'
  ]
}
});
};

```

**public/hack.js**

```
import 'plugins/hugo_kibana_plugin/less/main.less';

```

**public/less/main.less**

```
.global-nav {
  background-color: yellow;
}
```

---

_[View the full topic](https://discuss.elastic.co/t/how-to-apply-custom-css-in-kibana-ui/37434)._