# How to customize kibana appearance?

**URL:** https://discuss.elastic.co/t/how-to-customize-kibana-appearance/156680
**Category:** Kibana
**Created:** [November 14, 2018, 1:49pm UTC](https://discuss.elastic.co/t/how-to-customize-kibana-appearance/156680 "2018-11-14T13:49:44Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![asp](https://avatars.discourse-cdn.com/v4/letter/a/9fc348/32.png) [@asp](https://discuss.elastic.co/u/asp)
#### Post date: [November 14, 2018, 1:49pm UTC](https://discuss.elastic.co/t/how-to-customize-kibana-appearance/156680/1 "2018-11-14T13:49:44Z")

</div>

Hi, is it possible to customize kibana?  
I would like to change the appearance a bit which means I want to change the following:

- font
- text foreground color
- background color
- maybe changing / replacing the kibana logo.

Is that possible?

How?

Thanks, Andreas

---

<div class="post-metadata">

### Author: ![timroes](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/timroes/32/19712_2.png) [@timroes](https://discuss.elastic.co/u/timroes)
#### Post date: [November 14, 2018, 3:23pm UTC](https://discuss.elastic.co/t/how-to-customize-kibana-appearance/156680/2 "2018-11-14T15:23:09Z")

</div>

Hi Andreas,

right now you unfortunately have to modify the CSS of Kibana, i.e. provide a modified Kibana version to change styling. Please follow [https://github.com/elastic/kibana/issues/17879](https://github.com/elastic/kibana/issues/17879) for more updates onto themability of Kibana.

Cheers,  
Tim

---

<div class="post-metadata">

### Author: ![asp](https://avatars.discourse-cdn.com/v4/letter/a/9fc348/32.png) [@asp](https://discuss.elastic.co/u/asp)
#### Post date: [November 15, 2018, 7:52am UTC](https://discuss.elastic.co/t/how-to-customize-kibana-appearance/156680/3 "2018-11-15T07:52:09Z")

</div>

Hi Tim,

thanks for the reply. I am not familiar with css yet. A quick glimpse into the kibana directories shows a lot of css files. Is there any documentation or tutorial or design guide?

A little push in the direction to get the needed files identified would be appreciated.

Greetings, Andreas

---

<div class="post-metadata">

### Author: ![timroes](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/timroes/32/19712_2.png) [@timroes](https://discuss.elastic.co/u/timroes)
#### Post date: [November 15, 2018, 8:05am UTC](https://discuss.elastic.co/t/how-to-customize-kibana-appearance/156680/4 "2018-11-15T08:05:01Z")

</div>

Hi,

sorry there is no tutorial or guideline for that, since we are not documenting how to modify Kibana, since that's basically not an API or something that's stable, so you would need to touch your modified version most likely every minor version to keep it up to date, why we are not trying to advertise that in general. Also the CSS/LESS/SASS is spread all over the place close to the feature it's for, so you would need to look through the repository to find the corresponding files. Usually you can just inspect elements in your dev tools and search for the class names you are looking for.

Cheers,  
Tim

---

<div class="post-metadata">

### Author: ![asp](https://avatars.discourse-cdn.com/v4/letter/a/9fc348/32.png) [@asp](https://discuss.elastic.co/u/asp)
#### Post date: [November 15, 2018, 8:09am UTC](https://discuss.elastic.co/t/how-to-customize-kibana-appearance/156680/5 "2018-11-15T08:09:19Z")

</div>

Thanks, I will have a look.

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)
#### Post date: [December 13, 2018, 8:09am UTC](https://discuss.elastic.co/t/how-to-customize-kibana-appearance/156680/6 "2018-12-13T08:09:19Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.
