I am using PyCharm as my IDE for about 1 year, and in my PyCharm setting --> Editor --> Appearance, "Show CSS color preview icon in gutter" is checked.
But the preview icon only shows in a <style> block in .html. And when I moved the styles into a separate .css file, the preview icon just not show.
How can I make the color preview icon show in a .css file in PyCharm ?
In the Settings/Preferences dialog ( Ctrl+Alt+S ), go to Editor | Inspections. Expand the CSS node and select the Browser compatibility for properties.
Create an HTML fileFrom the main menu, select File | New, and then select HTML File from the list. PyCharm creates a stub file based on the HTML file template and opens it in the editor.
Can't reproduce:

Check that .css is mapped to the correct file type in Settings | File Types.
Also try File | Invalidate Caches | Invalidate and Restart.
If the above doesn't help, contact support with a sample project to reproduce, your settings exported with File | Export Settings and idea.log.
UPDATE: colors in the gutter may not show if you have Highlighting Level set lower than Inspections:

I had the same issue (with PhpStorm) and the solution was to choose any other scheme than Dracula.
Update: Alternatively, I had to decrease the editor font size in order to display the colors. See this bug.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With