Highlight CSS colours in Sublime Text

Highlight CSS colours in Sublime Text

In What The Flexbox, one of the biggest questions I've received is "how do you get your colours to show up in Sublime Text like that"?

I've answered it maybe 20 times now. The trick is getting them to show up all the time, instead of just when you click a color. This is one of my favourite packages because it works in CSS, Stylus, Sass and Less! Here is a quick 101. Watch the video or read the text below:

https://youtu.be/255Rs-qCPVY

First, install the Color Highlighter package from Package Control

Next, restart Sublime Text.

Then, in Preferences → Package Settings → Color Highlighter → Settings - User

Use the "filled" setting to make them show all the time.

{
"ha_style": "filled"
}

Enjoy! You can also grab my Sublime Text Book and use WESBOS for $10 off.

Find an issue with this post? Think you could clarify, update or add something?

All my posts are available to edit on Github. Any fix, little or small, is appreciated!

Edit on Github

Syntax Podcast

Hold on — I'm grabbin' the last one.

Listen Now →
Syntax Podcast

@wesbos Instant Grams

Beginner JavaScript

Beginner JavaScript

A fun, exercise heavy approach to learning Modern JavaScript from scratch. This is a course for absolute beginners or anyone looking to brush up on their fundamentals. Start here if you are new to JS or programming in general!

BeginnerJavaScript.com
I post videos on and code on

Wes Bos © 1999 — 2024

Terms × Privacy Policy