Nord theme for Vimium

nord_vimium.css

/* Nord Vomnibar CSS */
/* Installation: Open Vimium Options -> Click "Show Advanced Options" and paste this into the CSS for Vimium UI text area. */

#vomnibar ol, #vomnibar ul {
  list-style: none;
  display: none;
}

#vomnibar {
  background: rgba(46, 52, 68, 0.9);
  color: #E5E9F0;
  border-radius: 12px;
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2);
  border: none;
  backdrop-filter: blur(2px);
}

#vomnibar input {
  color: #E5E9F0;
  font-size: 24px;
  height: auto;
  margin-bottom: 0;
  padding: 15px;
  background-color: unset;
  border-radius: 4px;
  border: none;
  box-shadow: none;
}

#vomnibar .vomnibarSearchArea {
  padding: 0;
  background-color: unset;
  border-radius: 4px 4px 0 0;
  border-bottom: none;
}

#vomnibar ul {
  background-color: rgba(76, 86, 106, 0.8);
}

#vomnibar li {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  color: #E5E9F0;
}

#vomnibar li.vomnibarSelected {
  background-color: rgba(136, 192, 208, 1);
}

#vomnibar li .vomnibarSource {
  color: #D8DEE9;
}

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

#vomnibar li .vomnibarUrl {
  color: #88C0D0;
}

#vomnibar li .vomnibarMatch {
  color: #EBCB8B;
}

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

#vomnibar li.vomnibarSelected .vomnibarSource {
  color: #4C566A;
}

#vomnibar li.vomnibarSelected em, #vomnibar li.vomnibarSelected .vomnibarTitle {
  color: #3B424F;
}

#vomnibar li.vomnibarSelected .vomnibarUrl {
  color: #4C566A;
}

#vomnibar li.vomnibarSelected .vomnibarMatch {
  color: #2E3440;
}

/* Light Markers */
div > .internalVimiumHintMarker.vimiumHintMarker {
  background: #EBCB8B;
  font-size: 12px;
  border: 1px solid rgba(0,0,0,0.15)
  border-radius: 5px;
  box-shadow: 0em 0.1em 0.6em 0.1em rgba(0, 0, 0, 0.2);
  padding: 2px 4px;
}

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

/* Link hint matching characters */
div > .internalVimiumHintMarker.vimiumHintMarker > .matchingCharacter {
  color: #2E3440;
}

/* Dark Markers */
/* Remove everything from here below if you prefer light markers */
div > .internalVimiumHintMarker.vimiumHintMarker {
  background: #5E81AC;
  font-size: 12px;
  border: none;
  border-radius: 5px;
  box-shadow: 0em 0.1em 0.6em 0.1em rgba(0, 0, 0, 0.2);
  padding: 2px 4px;
}

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

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