Vimium: vomnibar color

[ralphee]

how can i change the colour of the vomnibar in firefox?

[shibumi]

You need to write CSS for it.. (at least thats how It works in chromium)

[gdh1995]

Steps: on Vimium's options page, click "show advanced options" at the page bottom, and then write CSS in the textarea of "CSS for Vimium UI".

[shibumi]

Here is my current configuration:

/* Arc Dark theme */

/* Link hint boxes */
div > .vimiumHintMarker {
  background: #383c4a;
  font-size: 12px;
  border: 0.25em solid #383c4a;
  border-radius: 0.68em;
  box-shadow: 0em 0.1em 0.6em 0.1em rgba(0, 0, 0, 0.4);
}

/* Link hint text */
div > .vimiumHintMarker span {
  color: #e2e3e7;
  font-size: inherit;
  text-shadow: none;
}

/* Link hint matching characters */
div > .vimiumHintMarker > .matchingCharacter {
  color: #5294e2;
}

input#vomnibarInput.vimiumReset {
    color: #FFF !important;
  background-color: #111 !important;
}

#vomnibar {
   border-color: black;
   background-color: black;
}

#vomnibar .vomnibarSearchArea {
   background-color: #222;
   border-bottom: #3f3f3f;
}

#vomnibar input {
   border-color: #393939;
}

#vomnibar ul {
    background-color: #222;
}

#vomnibar li {
   border-bottom: #3f3f3f;
}

#vomnibar li .vomnibarUrl {
   color: #5294e2;
}

#vomnibar li .vomnibarMatch {
   color: white;
}

#vomnibar li.vomnibarSelected {
    background-color: #181D24;
}

#vomnibar li em .vomnibarMatch, #vomnibar li .vomnibarTitle .vomnibarMatch {
   color: white;
}

#vomnibar li em, #vomnibar li .vomnibarTitle {
   color: #ddd;
}

[shibumi]

Maybe we should open a hub for color schemes in the vimium wiki

[nadya-p]

Alternatively, Dark Reader chrome extension darkens everything including the vomnibar.

[shibumi]

@nadya-p last time When I've tried this it didn't work..

[nadya-p]

It works fine for me (Google Chrome 78.0.3904.97 64-bit, Vimium 1.64.6, Dark Reader 4.8.4).