Playground de contrast-color() en CSS

Explora contrast-color() con un selector de color de fondo. El ejemplo aplica el color elegido a un botón y deja que CSS resuelva automáticamente si el texto debe ser blanco o negro, con una salida de código inspirada en MDN.

Tu navegador todavía no soporta contrast-color(); se muestra un fallback.

HTML

<button class="contrast-color-demo" type="button">
  Button
</button>

CSS

.contrast-color-demo {
  --button-color: #660066;
  background-color: var(--button-color);
  color: contrast-color(var(--button-color));
}