# Change Color of Kibana Top Banner **URL:** \ **Category:** Kibana\ **Created:** [April 5, 2016, 1:15pm UTC](https://discuss.elastic.co/t/change-color-of-kibana-top-banner/46395 "2016-04-05T13:15:25Z")\ **Posts on this page:** 7\ **Page:** 1
**Author:** ![michelle.foy](https://avatars.discourse-cdn.com/v4/letter/m/7c8e57/32.png) [@michelle.foy](https://discuss.elastic.co/u/michelle.foy)\ **Post date:** [April 5, 2016, 1:15pm UTC](https://discuss.elastic.co/t/change-color-of-kibana-top-banner/46395/1 "2016-04-05T13:15:25Z")
Hi, I have been able to change the Kibana logo in the Kibana 4.X top banner, but what about changing the background color of the navigation banner? Is there a simple way of changing the color code from black/dark grey to something else? All I want to change is the solid background color (not the shadowing on the buttons). I've been looking through some of the Bootstrap .less files in /opt/kibana/node\_modules/bootstrap/less but not exactly sure where I where I should make my changes (theme.less?). I have not worked much at all with Bootstrap so can anyone help me out? Thanks, Michelle ---
**Author:** ![BigFunger](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/bigfunger/32/7323_2.png) [@BigFunger](https://discuss.elastic.co/u/BigFunger)\ **Post date:** [April 5, 2016, 7:11pm UTC](https://discuss.elastic.co/t/change-color-of-kibana-top-banner/46395/2 "2016-04-05T19:11:43Z")
@michelle.foy I assume that you are running from a custom build of Kibana, since you mentioned that you are already modifying the logo in the corner. If that is an incorrect assumption, let me know. If that is the case, you need to modify the kibana.js file found in `/src/plugins/kibana/public/kibana.js` Find this line: `.setNavBackground('#222222222')` and modify that hex value to whatever you want. Let me know if that solves your problem! ---
**Author:** ![michelle.foy](https://avatars.discourse-cdn.com/v4/letter/m/7c8e57/32.png) [@michelle.foy](https://discuss.elastic.co/u/michelle.foy)\ **Post date:** [April 6, 2016, 6:05pm UTC](https://discuss.elastic.co/t/change-color-of-kibana-top-banner/46395/3 "2016-04-06T18:05:51Z")
That worked as I wanted thanks! ---
**Author:** ![michelle.foy](https://avatars.discourse-cdn.com/v4/letter/m/7c8e57/32.png) [@michelle.foy](https://discuss.elastic.co/u/michelle.foy)\ **Post date:** [April 8, 2016, 2:32pm UTC](https://discuss.elastic.co/t/change-color-of-kibana-top-banner/46395/4 "2016-04-08T14:32:28Z")
@BigFunger Is there any way to change the text color in that same top banner? (i.e. change text color of Discover, Visualize, Settings, & Time Picker) ---
**Author:** ![BigFunger](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/bigfunger/32/7323_2.png) [@BigFunger](https://discuss.elastic.co/u/BigFunger)\ **Post date:** [April 18, 2016, 4:19pm UTC](https://discuss.elastic.co/t/change-color-of-kibana-top-banner/46395/5 "2016-04-18T16:19:34Z")
> [@michelle.foy](#): > > change text color of Discover, Visualize, Settings, & Time Picker @michelle.foy, were you able to figure out how to accomplish this? You need to tweak values in `/src/ui/public/styles/variables/bootstrap-mods.less` for the rest of the formatting. ---
**Author:** ![michelle.foy](https://avatars.discourse-cdn.com/v4/letter/m/7c8e57/32.png) [@michelle.foy](https://discuss.elastic.co/u/michelle.foy)\ **Post date:** [April 18, 2016, 6:07pm UTC](https://discuss.elastic.co/t/change-color-of-kibana-top-banner/46395/6 "2016-04-18T18:07:24Z")
@BigFunger Yes! Thank you, after fiddling around I was able to change the colors in the top banner by changing the following color codes: - ./bootstrap-mods.less:@navbar-inverse-link-color - ./bootstrap-mods.less:@navbar-inverse-link-hover-color - ./bootstrap-mods.less:@navbar-inverse-link-active-color - ./bootstrap-mods.less:@navbar-inverse-brand-color ---
**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\ **Post date:** [July 6, 2017, 1:55pm UTC](https://discuss.elastic.co/t/change-color-of-kibana-top-banner/46395/7 "2017-07-06T13:55:46Z")