Playground de alpha() en CSS

Modifica solo la opacidad de un color con alpha(). Fija un nuevo alfa o multiplica el original con calc(alpha * …), conservando sus componentes y espacio de color.

Original

Resultado con alpha()

HTML

<div class="alpha-demo"></div>

CSS

.alpha-demo {
  --origin-color: oklch(65% 0.2 260 / 0.8);
  background-color: alpha(from var(--origin-color) / 50%);
  inline-size: 12rem;
  aspect-ratio: 1;
  border-radius: 50%;
}