AtomColorHighlight Package


A quick post to announce my first Atom package: AtomColorHighlight.
It highlights colors expression in buffers. Currently all CSS syntaxes as well as hexadecimal integer such 0xFFFFFFFF and GLSL vec4 are supported.
It’s also possible to extend the highlighter with custom syntax, but i have yet to write documentation about this feature.


  • detect cursors over markers in order to hide the color background (a workaround to the fact that I can’t change the code color without touching to the active language grammar)
  • Handling of basic color operations such darken, lighten and transparentize (it’ll probably be tough but I think it worse give it a try)

Comments and feedbacks are welcome :slight_smile:


I like the extension information in your package documentation. I think if package authors can provide these kinds of extension points, that is where Atom will really shine.

I notice in your screen shots that the contrast of foreground color vs. background color is sometimes very low in things you highlight. You could use the LESS contrast() function to decide whether the foreground color should be black or white depending on the color you’re highlighting.


Thanks for the feedback, as for v0.4.0 the foreground contrast is now handled properly, without breaking neither selections nor cursors (which was the most tricky part).
It doesn’t rely on the less contrast function though, mostly because I don’t rely on less for setting the markers color.

Transparent colors are also much more visible now as markers have an opaque checkboard background, it makes sure the foreground still contrast with the background (the checkboard use neutral greys) and even mostly transparent colors contrast with the editor background.