Adding a background image to tree view


I want to add a small png image to the bottom of my tree view in my custom UI theme.

How can I do this? I’ve tried setting

.tree-view {
  background-image: url('img.png');
  background-position: left bottom;

But have had no luck.


As seen on the code of the tree-view-background package:

.tree-view {
  background: transparent !important;

.tree-view-background {
  content: "";
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1;
  position: absolute;


Thanks for the answer @rgawenda.

Using the above code and adding

background-image: url("img.png");

I still don’t see my image in the tree-view. I have also tried url("styles/img.png"), which still does not work.

Can I confirm that tree-view-background is a default element in Atom, and hasn’t been added by the tree-view-background package? I would like to be able to export this theme for use without requiring the tree-view-background package.


In fact, looking at some of the tree-view-background package source, I can see they have created the tree-view-background element themselves.