Chrome DevTools converts all HEX Colors to RGB

Question

Recently, Chrome DevTools has begun converting all elements' HEX colors to their RGB values, regardless of whether that HEX color is set in CSS or through the DevTools itself. How to stop that?

I am aware of the hold down Shift + click the color icon method of converting colors to other formats, but I find this inconvenient. I am wondering if anyone knows how to stop this from happening?

Extensometer

Answer 1

Step 1, click the gear icon

Step 2, change Color format

Original answer

Open Chrome DevTools panel:

Click 3 dots icon at the far right corner, select Settings, and in the Preferences panel find Elements > Color format, select the option you wish to have, As authored is the default option.

Pokey

This option no longer appears in Chrome 77.0.3865.90, and I'm getting everything converted to RGB. – Tegan

As of 78.0.3904.108, it's in Appearance, not Elements (inside DevTools › Preferences.) – Asur

After IE its Chrome's turn to turn developers lives complex – Chemotropism

This option seems to currently not be honored :( – Geanticlinal

The option is available but Aaron is right, it's not honored. But only if you pick "As authored". You can select "Hex" and it will show the colors as hex values. Not the greatest but at least you can get colors one way or the other. – Boutis

This feature seems to be removed now. Hex codes are so much better once your wrap your head around them. Please stop trying to herd us into using RGB – Aberrant

Color format setting doesn't work for me. Still lists color properties as rgb values – Tuantuareg

Answer 2

As of Chrome 114.0.5735.199 (July 2023).

1. Hover mouse over color in DevTools, it gives a hint to Shift-click.

2. Shift-click the color, select the color format you want.

3. Select and copy the value in the selected format.

Stalk

Hex is not an option on my side. I have rgb, hsl, hwb, and many others, but the hex code does not appear in the list – Tuantuareg

Great. Now I have to click 30 more times a day. Why the h*ll would you shoehorn this setting to all your users, and remove the "as authored" option. This seems like one of these Adobe programmers, that never use their own tools themselves and then make terrible UX decisions . – Turkic

Answer 3

Either click of the updown arrow ↕ , there will be different formats from which we can choose from to show the colors or press shift and click the color palette to choose a different format.

Hail

Answer 4

So there's no positive answer for Chrome/Brave/Edge. If you are on Mac, you can use Safari where you can see the HEX underneath.

Tippets