Skip to content

Instantly share code, notes, and snippets.

@nerdius
Last active May 12, 2026 07:16
Show Gist options
  • Select an option

  • Save nerdius/63d99e826a63689d6182130bae299eb0 to your computer and use it in GitHub Desktop.

Select an option

Save nerdius/63d99e826a63689d6182130bae299eb0 to your computer and use it in GitHub Desktop.
Arc Dark theme for styling Vimium link hints
/*
Arc Dark theme for styling Vimium link hints
By Giorgi Gzirishvili (@giogziro95). This code is in the public domain.
To use:
1. Copy the code.
2. Go to the Vimium options.
3. Click Show Advanced Options.
4. Under Advanced Options, scroll down to CSS for link hints.
5. Paste the code in the text field.
6. Click Save Changes.
7. Go to the website of your choice (or, if you have it open already, reload it) and check out the results.
*/
/* 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;
}
@nerdius

nerdius commented May 22, 2019

Copy link
Copy Markdown
Author

@shibumi, I don't have one, sorry. I didn't even know that the omnibox was themeable.

@shibumi

shibumi commented May 22, 2019

Copy link
Copy Markdown

@giogziro95

Here is my configuration. It has color changes for the vomnibox as well:

/* 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;
}

@nerdius

nerdius commented May 28, 2019

Copy link
Copy Markdown
Author

@shibumi, thanks! I'll consider supplementing my gist as well.

@allmeta

allmeta commented Sep 8, 2019

Copy link
Copy Markdown

It's a bit bugged with iframes, I'm sure you've noticed.
Probably hard to fix though
image

@nerdius

nerdius commented Sep 9, 2019

Copy link
Copy Markdown
Author

@allmeta, yeah, I'm aware; however, I can't fix it at the style-level. You should consider reporting it to Vimium maintainers instead. (Just search through the known issues beforehand to make sure it's not already reported so you don't create a duplicate.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment