---
title: "ColorInput"
description: "Anything the contrast functions accept: an sRGB triple, an OKLCH object, or a CSS colour string (`#0b6bcb`, `oklch(0.62 0.17 15)`, `rgb(11 107 203)`)."
url: "https://opsinjs.pensievelabs.org/reference/api/ColorInput"
source: "https://opsinjs.pensievelabs.org/reference/api/ColorInput.md"
section: "Reference"
kind: "reference"
---

> Elements written as `<PascalCase … />` below are opsinjs documentation
> components. Their attributes are the content: the values they render are
> generated from `tokens/*.json` and `registry/catalogue.ts` and are
> published separately at https://opsinjs.pensievelabs.org/r/index.json and under the Reference
> section.
> Nothing is missing from this page. The data simply does not live in
> the prose.

{/* GENERATED - do not edit. Source: the declaration named in the table below.
    Script: scripts/build-reference.mts. Change the doc comment on the symbol. */}

<PageTemplate kind="reference" />

## How this is generated [#how-this-is-generated]

Source: `lib/color/apca.ts`. Script: `scripts/build-reference.mts`. Command:
`pnpm run generate`.

Everything below is copied from the symbol, so a page is improved by improving
its doc comment. The [API index](./index.mdx) says why there is a page per
symbol and what these pages still do not carry.

{/* opsinjs:generated:begin - everything below is replaced by scripts/build-reference.mts */}

## ColorInput [#colorinput]

Anything the contrast functions accept: an sRGB triple, an OKLCH object, or a CSS colour string (`#0b6bcb`, `oklch(0.62 0.17 15)`, `rgb(11 107 203)`).

The string form is here because the two callers that matter most are a route handler receiving JSON and a playground receiving a paste, and neither has a triple to hand. A string that cannot be parsed yields NaN rather than an exception or a silent black: NaN propagates visibly into the response and into any comparison, which is the behaviour you want from a number nobody managed to measure.

| Kind | Declared in         |
| ---- | ------------------- |
| type | `lib/color/apca.ts` |

```ts
export type ColorInput = Rgb255 | Oklch | string
```

{/* opsinjs:generated:end */}