Derive From Context

spinning new colors out of an existing one

.btn {
  background: var(--brand);
  border-color: oklch(from var(--brand) calc(l - .2) c h);

  &:hover {
    background: oklch(from var(--brand) calc(l - .1) c h);
  }
}