Hexadecimal color code for transparency
Hexadecimal color code for transparency. GitHub Gist: instantly share code, notes, and snippets....
I've been back to this Gist so often lately. 8 digit hex codes are a great alternative to RGBA if you're using a styling library like Emotion or a React component library like Material UI and you want to store your colors as 6 digit hex codes. They allow you to change opacity by adding two characters to the end with string interpolation. For example, a white background at 50% opacity would be written
I believe the Gist was originally created back when support was mostly limited to Android (which is why the examples add the alpha codes to the beginning) but, according to Can I use... support is pretty widespread today.
And as a bonus, people in the comments have provided the list in different formats like objects and arrays.
background: #ffffff80
or, in JavaScript with a variable, something like background: `${theme.background}80`
. The only catch is remembering the alpha codes and that's where this link comes in handy.
I believe the Gist was originally created back when support was mostly limited to Android (which is why the examples add the alpha codes to the beginning) but, according to Can I use... support is pretty widespread today.
And as a bonus, people in the comments have provided the list in different formats like objects and arrays.
Advertisement
Advertisement