State set

Add to cart Sold out

Hover, press and tab to the first button.

Every state at once

• Add to cartRestvar(--accent)
  …
• Add to cartHovercolor-mix(in oklch, var(--accent), var(--ink) 15%)
  …
• Add to cartActive (pressed)color-mix(… var(--ink) 30%)
  …
• Sold outDisabledoklch(from var(--accent) l calc(c * 0.15) h)
  …
• Selected rowSelectedoklch(from var(--accent) 0.93 calc(c * 0.35) h)L 0.32 in dark mode
  …
• Add to cartFocus ringoklch(from var(--accent) 0.45 c h)L 0.82 in dark mode
  …

What this browser used

• …
• …
• …