# \[vtk.js\] Add logo to render view
**URL:** https://discourse.vtk.org/t/vtk-js-add-logo-to-render-view/4068
**Category:** Web
**Created:** [August 25, 2020, 3:44pm UTC](https://discourse.vtk.org/t/vtk-js-add-logo-to-render-view/4068 "2020-08-25T15:44:31Z")
**Posts on this page:** 7
**Page:** 1
### Author:  [@banesullivan](https://discourse.vtk.org/u/banesullivan)
#### Post date: [August 25, 2020, 3:44pm UTC](https://discourse.vtk.org/t/vtk-js-add-logo-to-render-view/4068/1 "2020-08-25T15:44:31Z")
I’m curious if there is an easy way to add a logo/icon to the top right of the vtk.js render window.
Would I do something like (I’m not getting this to work):
```auto
...
import style from './controller.css';
import icon from './logo.png';
...
const fullScreenRenderer = vtkFullScreenRenderWindow.newInstance();
...
const container = fullScreenRenderer.getContainer();
const logo = new Image();
logo.src = icon;
logo.setAttribute('class', style.logo);
container.appendChild(logo);
```
with a style file containing:
```css
.logo {
position: absolute;
top: 5px;
right: 5px;
height: 2.0em;
width: 2.0em;
cursor: pointer;
z-index: 100;
}
```
---
### Author:  [@Forrest](https://discourse.vtk.org/u/Forrest)
#### Post date: [August 25, 2020, 4:24pm UTC](https://discourse.vtk.org/t/vtk-js-add-logo-to-render-view/4068/2 "2020-08-25T16:24:36Z")
Do you have a loader that loads `logo.png` into a data uri? (I think url-loader does this.)
---
### Author:  [@banesullivan](https://discourse.vtk.org/u/banesullivan)
#### Post date: [August 25, 2020, 4:26pm UTC](https://discourse.vtk.org/t/vtk-js-add-logo-to-render-view/4068/3 "2020-08-25T16:26:54Z")
Yep, I’m using webpack to bundle it and I have url-loader in the rules
```auto
{ test: /\.(png|jpg)$/, use: 'url-loader?limit=81920' },
```
---
### Author:  [@banesullivan](https://discourse.vtk.org/u/banesullivan)
#### Post date: [August 25, 2020, 4:35pm UTC](https://discourse.vtk.org/t/vtk-js-add-logo-to-render-view/4068/4 "2020-08-25T16:35:10Z")
The image has made it in, but perhaps the style isn’t being applied/it is not showing in the correct place:
---
### Author:  [@banesullivan](https://discourse.vtk.org/u/banesullivan)
#### Post date: [August 25, 2020, 4:41pm UTC](https://discourse.vtk.org/t/vtk-js-add-logo-to-render-view/4068/5 "2020-08-25T16:41:16Z")
Aha, yep. I can confirm that the above code works, just the style is not being applied for some reason. Manually adjusting the style does the trick
---
### Author:  [@banesullivan](https://discourse.vtk.org/u/banesullivan)
#### Post date: [August 25, 2020, 4:56pm UTC](https://discourse.vtk.org/t/vtk-js-add-logo-to-render-view/4068/6 "2020-08-25T16:56:17Z")
In case someone else stumbles upon this and needs a way to easily embed a logo, this works:
```auto
const container = fullScreenRenderer.getContainer();
const linker = document.createElement('a');
linker.target = '_blank';
linker.href = 'http://www.kitware.com/';
const logo = new Image();
logo.src = icon;
logo.style.position = 'absolute';
logo.style.top = '25px';
logo.style.right = '25px';
logo.style.height = '75px';
logo.style.cursor = 'pointer';
linker.appendChild(logo);
container.appendChild(linker);
```
Though it’d be great to have the CSS handle the styling…
---
### Author:  [@Forrest](https://discourse.vtk.org/u/Forrest)
#### Post date: [August 25, 2020, 5:45pm UTC](https://discourse.vtk.org/t/vtk-js-add-logo-to-render-view/4068/7 "2020-08-25T17:45:42Z")
Oh, `style.logo` is undefined, so make sure your CSS is being imported correctly.