Search code examples
cssrgbopacity

How to give opacity to a color with hex value in css?

In hsl value, we can give opacity as

background: hsla(213, 34%, 12%, .5);

and in rgb as

background: rgba(134, 231, 54, .5);

I wonder how we can give opacity to hex value?

Solution

  • You may use this way to convert the transparent for your current hex colour

    For example, you want to set 40% alpha transparency to #000000 (black colour), you need to add 66 like this #00000066. The format is #RRGGBBAA so you could use a format like #00ff001C.

    You could also check the full table hex -> transparent colour here https://gist.github.com/lopspower/03fb1cc0ac9f32ef38f4