Opacidad
Embed This Widget
Add the script tag and a data attribute to embed this widget.
Embed via iframe for maximum compatibility.
<iframe src="https://colorfyi.com/iframe/glossary/opacity/" width="420" height="400" frameborder="0" style="border:0;border-radius:10px;max-width:100%" loading="lazy"></iframe>Paste this URL in WordPress, Medium, or any oEmbed-compatible platform.
https://colorfyi.com/glossary/opacity/Add a dynamic SVG badge to your README or docs.
[](https://colorfyi.com/glossary/opacity/)Use the native HTML custom element.
El grado en que un color o elemento bloquea el contenido que hay detrás, donde el 100% es completamente opaco y el 0% es completamente transparente.
Opacity is the inverse of transparency. In CSS, opacity can be set using the opacity property (which affects the entire element and its children) or using alpha-channel color values like rgba() and hsla(). Opacity is essential for creating layered visual effects, overlay patterns, glass-morphism designs, and subtle background tints. When compositing semi-transparent colors, the visible result depends on both the foreground color and whatever is behind it, following the alpha compositing formula defined by Porter and Duff.
Pruébelo
Artículos relacionados
CSS color-mix(): Mezcla Colores Nativamente en el Navegador
Aprende CSS color-mix() para mezclar colores nativamente en el navegador. Domina la sintaxis, los espacios de color, los casos de uso prácticos y crea paletas dinámicas sin JavaScript.
Construyendo un Selector de Color como Web Component desde Cero
Construye un selector de color accesible como Web Component. Implementa renderizado en canvas, sliders de tono, canales alfa y eventos personalizados con Shadow DOM.
Esmeralda vs Jade vs Verde Bosque: Guía de Comparación de Verdes
Compara esmeralda (#50C878), jade (#00A86B) y verde bosque (#228B22). Aprende las diferencias visuales y en código hex entre estos populares tonos de verde.
Función CSS light-dark(): Cambio de Tema Nativo
Usa CSS light-dark() para cambiar temas de forma nativa. Reemplaza los interruptores de JavaScript y las media queries con una sola función CSS para colores en modo claro y oscuro.
Separación de Color Explicada: Preparar Archivos para Imprenta
Comprende la separación de color CMYK, planchas de tinta plana, trapping y marcas de registro. Prepara archivos listos para imprenta con separaciones de color correctas.
Animación de color en CSS: Transiciones y fotogramas clave
Domina la animación de color en CSS con transiciones, animaciones de fotogramas clave, rotación de tono HSL, interpolación OKLCH para suavidad perceptual y mejores prácticas de rendimiento.