# How to change the top left header logo in kibana 7.9.2
**URL:** https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084
**Category:** Kibana
**Created:** [September 27, 2020, 12:25pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084 "2020-09-27T12:25:06Z")
**Posts on this page:** 20
**Page:** 1
### Author:  [@witcher](https://discuss.elastic.co/u/witcher)
#### Post date: [September 27, 2020, 12:25pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/1 "2020-09-27T12:25:06Z")
this is where the dark theme is located.
`kibana-7.9.2-windows-x86_64\node_modules\@kbn\ui-shared-deps\target`
and this is the theme file exactly from inspecting the element.
`http://localhost:5601/33984/bundles/kbn-ui-shared-deps/kbn-ui-shared-deps.v7.dark.css`
---
### Author:  [@azasypkin](https://discuss.elastic.co/u/azasypkin)
#### Post date: [September 28, 2020, 8:19am UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/2 "2020-09-28T08:19:41Z")
Hi @witcher,
Do you really want to replace logo in just one this place? We have many places where logo shows up and unfortunately there is no easy way to replace them all at once right now unfortunately, but we want to change that. Please track progress [here](https://github.com/elastic/kibana/issues/75377).
Best,
Oleg
---
### Author:  [@witcher](https://discuss.elastic.co/u/witcher)
#### Post date: [September 28, 2020, 8:44am UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/3 "2020-09-28T08:44:01Z")
Hey @azasypkin this place and the login screen thanks for your reply.
any solution to solve this problem for now will be fine Thank You ๐
---
### Author:  [@azasypkin](https://discuss.elastic.co/u/azasypkin)
#### Post date: [September 28, 2020, 9:58am UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/4 "2020-09-28T09:58:32Z")
> [@witcher](#):
>
> this place and the login screen thanks for your reply.
> any solution to solve this problem for now will be fine
Well, until we handle it properly in [Customers/users should be able to replace Elastic logo and customize Kibana themes through advanced setting ยท Issue #75377 ยท elastic/kibana ยท GitHub](https://github.com/elastic/kibana/issues/75377) it's all unsupported and can change from version to version, but as a temporary workaround you can try to change these places in Kibana code:
- [Top logo](https://github.com/elastic/kibana/blob/44b08462985e0a5faff66078f4bea691fdd31669/src/core/public/chrome/ui/header/header_logo.tsx#L102), you can change `iconType` property to something like this `iconType={"https://some-host/some-picture.png"}`
- [Login page](https://github.com/elastic/kibana/blob/44b08462985e0a5faff66078f4bea691fdd31669/x-pack/plugins/security/public/authentication/login/login_page.tsx#L90), you can change `type` property to something like this `type={"https://some-host/some-picture.png"}`
Unfortunately it's not possible to do via pure CSS.
Hope that helps.
Best,
Oleg
---
### Author:  [@ManuelF](https://discuss.elastic.co/u/ManuelF)
#### Post date: [September 28, 2020, 3:07pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/5 "2020-09-28T15:07:38Z")
Hi @azasypkin,
I tried to change the "Top Logo" and the "Login Page Logo" by following your steps, but that did not work for me.
After restarting Kibana, I see no change at all. It does not matter if I even make a mistake while editing the code. It looks like Kibana just ignores the changes I made. When I inspect the code from the browser dev tool, none of the changes I made are there, but just the original code. Maybe I am editing the wrong files or maybe there is something else double checking the code and overwriting it at execution time like boostrap. Every time I change the code, I clean the browser cache and all local stored data before testing.
I know there's an official [project](https://github.com/elastic/kibana/issues/75377) in progress to add a feature that will allow users like me to easily customize Kibana UI. I am very exited about it and I can't wait to see it completed, but in the meantime, I'm OK with just temporary workarounds that allow me customize the UI. So if you have any more tricks up your sleeve, I'd be happy to try them out.
Thank you
---
### Author:  [@azasypkin](https://discuss.elastic.co/u/azasypkin)
#### Post date: [September 28, 2020, 3:12pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/6 "2020-09-28T15:12:07Z")
> [@ManuelF](#):
>
> I tried to change the "Top Logo" and the "Login Page Logo" by following your steps, but that did not work for me.
Hmm, I just tried it on v7.9.2 branch and it worked well for me. Do you run Kibana from source? How do you run it? The more details you can provider the better.
Best,
Oleg
---
### Author:  [@ManuelF](https://discuss.elastic.co/u/ManuelF)
#### Post date: [September 28, 2020, 3:44pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/7 "2020-09-28T15:44:20Z")
I am running SELKS 6, which integrates ELK 7.7 by default. After that I have been applying the upgrades as they are released.
---
### Author:  [@azasypkin](https://discuss.elastic.co/u/azasypkin)
#### Post date: [September 28, 2020, 3:57pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/8 "2020-09-28T15:57:34Z")
I haven't heard of SELKS 6 before to be honest, so I'm afraid I cannot suggest anything here since I'm not entirely sure how that integrates Kibana. But I guess it relies on the built version of it and obviously changes in the source files won't be reflected.
I'd better ask at SELKS forums to figure out how you can point it to the custom Kibana source or anything like this (you can of course try to modify built artifacts, but it's a slippery slope, really).
---
### Author:  [@ManuelF](https://discuss.elastic.co/u/ManuelF)
#### Post date: [September 28, 2020, 4:15pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/9 "2020-09-28T16:15:27Z")
@azasypkin, Basically it is an ELK on premises installation + other apps like Suricata, etc, just configured to ship data to that ELK. The ELK installation itself does not have anything customized, but a few pre-loaded visualizations, nothing in the code is customized. I just apply ELK updates and upgrades like normally do for any other app running on Debian 10.
---
### Author:  [@witcher](https://discuss.elastic.co/u/witcher)
#### Post date: [September 28, 2020, 4:19pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/10 "2020-09-28T16:19:41Z")
@azasypkin I tried your method but it did not work for me sorry I am new to kibana thanks for helping ๐
---
### Author:  [@azasypkin](https://discuss.elastic.co/u/azasypkin)
#### Post date: [September 29, 2020, 6:35am UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/11 "2020-09-29T06:35:58Z")
> [@witcher](#):
>
> @azasypkin I tried your method but it did not work for me sorry I am new to kibana thanks for helping
Well, it's hard to say what type of Kibana code you use. I assumed you folks have access to the source code that would allow you to tweak it. But if it's not the case, it'd be harder, and you'll need to point me to exact distributable you use and then I can try to find the right place you could tweak there.
---
### Author:  [@witcher](https://discuss.elastic.co/u/witcher)
#### Post date: [September 29, 2020, 7:47am UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/12 "2020-09-29T07:47:06Z")
@azasypkin
elasticv7.9.2 (not installed as a service)
[https://artifacts.elastic.co/downloads/elasticsearch/elasticsearch-7.9.2.msi](https://artifacts.elastic.co/downloads/elasticsearch/elasticsearch-7.9.2.msi)
Kibanav7.9.2
[https://artifacts.elastic.co/downloads/kibana/kibana-7.9.2-windows-x86\_64.zip](https://artifacts.elastic.co/downloads/kibana/kibana-7.9.2-windows-x86_64.zip)
these two are the exact ones I used.
---
### Author:  [@ManuelF](https://discuss.elastic.co/u/ManuelF)
#### Post date: [September 29, 2020, 12:30pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/13 "2020-09-29T12:30:49Z")
I use the regular on premises distro that runs in Debian 10. What you're suggesting is to edit the Kibana code BEFORE compiling or the JavaScript files AFTER compiled?
---
### Author:  [@azasypkin](https://discuss.elastic.co/u/azasypkin)
#### Post date: [September 30, 2020, 6:49am UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/14 "2020-09-30T06:49:05Z")
> [@ManuelF](#):
>
> I use the regular on premises distro that runs in Debian 10. What you're suggesting is to edit the Kibana code BEFORE compiling or the JavaScript files AFTER compiled?
It depends on what you can do, there are only two ways to patch Kibana with this temporary workaround:
1. Patch [source code](https://github.com/elastic/kibana/tree/v7.9.2), build it and use it instead (`Kibana code BEFORE compiling`) - **better option**
2. Patch already built "binary" code (`the JavaScript files AFTER compiled`) - the last resort option if you don't want to re-built Kibana from source
Best,
Oleg
---
### Author:  [@ManuelF](https://discuss.elastic.co/u/ManuelF)
#### Post date: [September 30, 2020, 12:47pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/15 "2020-09-30T12:47:04Z")
@azasypkin, honestly, I prefer the second option, although most attempts have failed as of version 7.9. I am currently using version 7.9.2 and I have only been able to customize the loading logo, the text below the loading logo, the favicon and its text.
I have tried editing the files mentioned in this and other posts, then restarted Kibana, but it does not make any change.
---
### Author:  [@azasypkin](https://discuss.elastic.co/u/azasypkin)
#### Post date: [September 30, 2020, 1:13pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/16 "2020-09-30T13:13:22Z")
Okay, I'll try to figure out the right file we can patch in the 7.9.2 distributable for the top logo and the one at the login page, should be the same for Windows/Debian.
---
### Author:  [@ManuelF](https://discuss.elastic.co/u/ManuelF)
#### Post date: [September 30, 2020, 1:57pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/17 "2020-09-30T13:57:25Z")
@azasypkin I really appreciate your interest in helping me and the community ๐
---
### Author:  [@witcher](https://discuss.elastic.co/u/witcher)
#### Post date: [October 1, 2020, 4:06am UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/18 "2020-10-01T04:06:25Z")
> [@azasypkin](#):
>
> > [@ManuelF](#):
> >
> > I use the regular on premises distro that runs in Debian 10. What you're suggesting is to edit the Kibana code BEFORE compiling or the JavaScript files AFTER compiled?
>
> It depends on what you can do, there are only two ways to patch Kibana with this temporary workaround:
>
> 1. Patch [source code](https://github.com/elastic/kibana/tree/v7.9.2), build it and use it instead (`Kibana code BEFORE compiling`) - **better option**
> 2. Patch already built "binary" code (`the JavaScript files AFTER compiled`) - the last resort option if you don't want to re-built Kibana from source
>
> Best,
> Oleg
@azasypkin is there a guide for any of the two options ?
---
### Author:  [@azasypkin](https://discuss.elastic.co/u/azasypkin)
#### Post date: [October 1, 2020, 11:14am UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/19 "2020-10-01T11:14:00Z")
> [@witcher](#):
>
> @azasypkin is there a guide for any of the two options ?
For the first option, yes, it's documented:
Just checkout [correct Kibana branch](https://github.com/elastic/kibana/tree/v7.9.2), [make your changes](https://www.elastic.co/guide/en/kibana/master/development-getting-started.html) and build it using [these instructions](https://www.elastic.co/guide/en/kibana/master/building-kibana.html).
For the second, it's a hack, and it's not something I can recommend, but since you asked...:
Login logo:
- Open `..../kibana-7.9.2-linux-x86_64/x-pack/plugins/security/target/public/4.plugin.js` (or where it's installed in your case, I used linux distrib)
- Find this string in this file `className:"loginWelcome__logo"`, and near that place should be `{type:"logoElastic",size:"xxl"}`, change it something like this `{type:"https://upload.wikimedia.org/wikipedia/commons/1/1e/RPC-JP_Logo.png",size:"xxl"}`
- You updated **source** , but server is serving compressed versions (`gz` or `br`, see files `4.plugin.js.br` and `4.plugin.js.gz` in the same folder), so you need to update compressed version as well, I just used [`gzip-cli`](https://www.npmjs.com/package/gzip-cli) tool with command like `npx gzip-cli .../kibana-7.9.2-linux-x86_64/x-pack/plugins/security/target/public/4.plugin.js`, it updated `gz` file for me.
Similar steps for the top header logo, but the file you need to edit is `.../kibana-7.9.2-linux-x86_64/src/core/target/public/core.entry.js` and the piece you need to change is `iconType:"logoElastic"` (located near `core.ui.chrome.headerGlobalNav.goHomePageIconAriaLabel` string).
Best,
Oleg
---
### Author:  [@witcher](https://discuss.elastic.co/u/witcher)
#### Post date: [October 1, 2020, 3:35pm UTC](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084/20 "2020-10-01T15:35:31Z")
@azasypkin first of all thank you. the login logo part worked but when i was trying to change the header logo after that its stuck
[Next page](https://discuss.elastic.co/t/how-to-change-the-top-left-header-logo-in-kibana-7-9-2/250084.md?page=2)