Request to Show Hex Color Code in Documentation

[brittanyeccles]

I hope this is the correct place for this, but if not, feel free to close this discussion.

Can y'all add in a way to view the corresponding hex color codes for the background colors and text colors?

I use this section quite frequently in the Tailwind documentation, especially when I am trying to do some design work in Figma. I use Tailwind colors in my designs so I can see what Tailwind class we should use for the background color, text color, hover state, etc. I frequently try different background colors and text colors in Figma to figure out what would look best for a design. Right now, since only the RGB color codes are displayed in the Tailwind documentation, I have to type that manually into Figma.

It would be much easier if I could just copy a hex code and then paste that into the color modifier in Figma. Overall, it's much easier to copy a hex color code than it is a RGB color code.

I also run into this when trying to use Hero Patterns. I like using tailwind colors to keep consistent with the colors I plan to use across the site. Their website only accept hex color codes so I have to go and convert the RGB color code from the Tailwind documentation to a hex color code and then paste that into Hero Patterns to get my design.

I understand this is not a major problem, but it is a common frustration of mine. Just wanted to share this feedback in case any one else runs into this too.

[wongjn]

The colors are available as hex codes at https://tailwindcss.com/docs/customizing-colors.

[brittanyeccles]

Oh that's perfect! I had no idea they were in a different section. That's exactly what I'm looking for. Thank you!