# 2025-06-18-1

Published: Wed, Jun 18, 2025
Tags: css

Automatic foreground color contrast based on the provided background color.

```css
button {
  --background: black;
  --foreground: color(
    from var(--background) xyz round(up, min(1, max(0, 0.18 - y)))
      round(up, min(1, max(0, 0.18 - y))) round(up, min(1, max(0, 0.18 - y)))
  );

  background-color: var(--background);
  color: var(--foreground);
}
```

via [blog.damato.design](https://blog.damato.design/posts/css-only-contrast/)