La verdad es que en la creación de mi sitio web nuevo me encontré con varias cosas intersantes, que no había establecido nunca en procesos prácticos, como por ejemplo qué hacer si necesito que algo tenga una apariencia de vidrio.

Siempre se puede recurrir al confiable PNG para que nos ayude con las transparencias desde el bien conocido Ilustrador, pero al utilizar este tipo de archivo hacemos más pesado el sitio que estamos creando y si tenemos a la mano una herramienta en web, muy útil que no genera más que unos bytes, como el código CSS, se transforma en un sin sentido usarlo.

El HEX es la forma más usada de expresar colores y también es un tipo de RGB, sólo que tiene la desventaja de que no hay forma de generar transparencia. RGBA se desglosa en RED, GREEN, BLUE y ALPHA ¿Por qué esto nos importa esta forma de generar color? Pues, el último es el grado de transparencia, lo cual lo transforma en la herramienta ideal para expresar un vidrio.

Igual que con el opacity, el alpha se mide desde 1 a 0 siendo 1 igual a 100% y 0 igual a 0% haciendo los intermedios el grado de transparencia, por ejemplo si yo quiero expresar el 50% de transparencia sería: 0.5.

Ahora que también necesitaré un poco de degradado entre los colores para que estos puedan dar la a apariencia de un reflejo... Pero ya no gasto más palabras y les dejo mi "Modesto efecto de vidrio en CSS".


3,566 0 1