Replace Kibana logo and loading icon in Kibana 7.0

[Sjaak01 (Sjaak)]

Logo

KB7 Custom Logo

Okay I found a way to add your own logo. Probably pretty hacky but it works. Open one of these files depending on the theme you're using: /node_modules/@elastic/eui/dist/eui_theme_light.css /node_modules/@elastic/eui/dist/eui_theme_dark.css Find .euiHeaderLogo__Icon and change opacity to 0. This will hide the original logo. Next look for euiHeaderLogo, should be right above .euiHeaderLogo__Icon. Add some css such as background-image and background-repeat to add your own logo. Now look for .…

Loading icon

Customize Kibana 6.5 Login Page

In case somebody else is looking into customizing Kibana 6.5 I've found the files that need to be edited for most of the basic stuff. Browser title and loading logo (1) kibana-6.5.0/src/ui/ui_render/views/chrome.pug Look for "kibana" and change that to a different text if you want a different title displayed in the browser. If you want to change the Kibana logo in the circular loading logo, look for a base64 string and replace this with a base64 of your own image. You can also change the hex…

Keep in mind that in 7.0 the location of the mentioned files has changed. I can't check right now but I believe it is something like build_assets/legacy. Just run a search for the text in the mentioned files and you should be able to quickly find the correct path.