Can vim syntax highlight HTML color codes with their color?

Question

It it possible to setup syntax highlighting in vim so that an html color sequence is colored in that color; e.g. #FF0000 would show up as red. I'd also be okay with it underlining the text that color like Visual Studio does.

So basically I'd be looking for the pattern \#([0-9a-fA-F]{3}){1,2} and then want to get the color for that and make that text that color.

Answer 1

Actually, as is often the case with vim, if you can think of the feature, someone has probably implemented it.

In this case, you are probably looking for the Colorizer plugin. Note that though this plugin “works best” with gvim, it supports 88 and 256 color terminals.

From the script site:

The idea is to highlight color names and codes in the same color that they represent. The plugin understands the W3-Colors (used for CSS files for example), the Color names from the X11 Window System and also codes in hex notation, like #FF0000 (which represents Red in the RGB color system). Additionally, it supports the CSS color specifications, e.g. rgb(RR,GG,BB) color representation in either absolutely values or as percentage and also the HVL Color representation like hvl(H,V,L)

Edit: You did not mention what operating system you're using, but the installation is fairly straight-forward even if done manually. However, if you are using Arch Linux, I packaged this plugin and it is available for installation through the AUR.

Answer 2

Currently (2020-11-12), there are several plugins for showing the color of HTML color code. There are:

• chrisbra/Colorizer
• lilydjwg/colorizer
• norcalli/nvim-colorizer.lua (neovim only, using nvim's Lua interface)

Answer 3

The thing is that many of the more simple terminals only support the limited number of ANSI colours [Black | Red | Green | Yellow | Blue | Magenta | Cyan | White ] in regular or bold, 16 in total.

The xterm-256color profile is supported by some of the more modern terminal emulators, such as gnome-terminal and PuTTY but 256 colors is still insufficient to cover the whole range of 16 million colours in the RGB colour space which would be required to display every RGB code as intended.