Colores hexagonales de 8 dígitos -

Una de las capacidades más solicitadas en mis inicios en el desarrollo web fue la capacidad de establecer la opacidad de elementos e incluso imágenes PNG sin la necesidad de hacks oCSS específicos del navegador. Finalmente obtuvimos soporte de opacidad nativa e incluso disfrutamos rgba()de la capacidad de citar un nivel de opacidad con un color.

Si bien me encantaba la capacidad de proporcionar opacidad con el color usando rgba(), el uso del color hexadecimal siempre había estado arraigado en mí, lo que hacía que la repentina necesidad de realizar conversiones rgba fuera molesta. ¡Afortunadamente hoy en día tenemos valores hexadecimales de 8 dígitos que nos permiten citar un nivel de opacidad como los dos últimos caracteres del valor hexadecimal!

El CSS

Hex implica “seis”, pero los dos últimos dígitos del valor hexadecimal de 8 caracteres son el valor de opacidad:

.myElement { /* { rojo/50% de opacidad } */ /* rosa de fondo blanco */ fondo: #ff000080;}

Me encanta que podamos usar colores hexadecimales con el valor de opacidad adicional; La necesidad de convertir a rgba para aprovechar la opacidad era una frustración innecesaria. ¡Le debo algo al creador de esta API!