I also wanted to add, if you guys do add colorized hex values—be it in the gutter or as a background to the text itself (I think I’d prefer it behind the text itself resembling an inline-block, as opposed to the gutter, since we could have multiple color values on one line), it would also be very beneficial to make it work for CSS variables. All modern browsers support CSS variables now ( I think even Apple patched Safari a few versions ago to fix some glitches).
Example of what would be colored: :root { —my-sexy-color:#223344; } .some_div {background: var(—my-sexy-color); background:black; box-shadow 0 0 10px rgba(80,80,80,.5); color:#ffbb00}
If you have more than one color on a line, you can see in the attachment example how a gutter color would probably only show the first color attribute. There might be a bunch of colors, like if you’re styling form elements, in which case, a single color wouldn’t help much. You could change the gutter color to reflect where the cursor was, but I think a big block of color right behind the text itself would be simplest and best, it will stand out and make it easier to tweak than having to glance left.
I would suggest supporting #000000, #000, rgb(), rgba(), var(), —my-var, and named colors (white, black, red, etc). I don’t think opacity would be necessary for rgba() as it’s heavily dependent on what’s behind it, but I wouldn’t be opposed to it.
Gradients would be overkill, but coloring the individual color values in gradients would be nice.
Anyway, just my 2¢.
