chroma-panel is on 0.x. The current version is 0.1.3, first published on September 14, 2026. There is no published roadmap, so this page does not give you one. What follows is what the package does today, where it stops, and which of those stopping points are open questions rather than settled design. Nothing here is a commitment, and no dates are implied.
Decisions get made on the issue tracker. If you want one of these to move, that is the place to say so.
Known limits today
Each item below is documented elsewhere in these docs. The links go to the page that covers the behavior in full.
The eyedropper is Chromium-only
It uses the browser's EyeDropper API, which today means Chromium browsers.
showEyedropper defaults to true, but the button renders only where the API
exists, so nothing breaks in Firefox or Safari — the control is simply not
there. If you build your own trigger, check supported first:
import { useEyedropper } from "chroma-panel";
export function PickButton() {
const { supported, pick } = useEyedropper();
if (!supported) {
return null;
}
return <button onClick={() => void pick()}>Pick a color</button>;
}See useEyedropper. Whether a fallback exists for other browsers is an open question; nothing has been announced.
Image sampling needs two browser APIs
It needs createImageBitmap and OffscreenCanvas. Both are present in every
browser that clears the minimum versions below, so in practice this is not a
separate floor. See image mode.
The minimum browsers are from 2024
Chrome 123, Firefox 120 and Safari 17.5. The stylesheet uses light-dark(),
which is the newest thing in it and therefore sets the floor. Below those
versions the CSS does not apply and the panel renders unstyled. Whether that
floor ever drops is an open question — see
browser support for what each feature
contributes.
Parsing does not cover OKLCH or LCH
parse accepts hex in 3, 4, 6 and 8 digits, rgb(), rgba(), hsl(),
hsla(), hwb() and the transparent keyword. Color names work only after you
call registerNamedColors, because the table is a separate entry point. That is
the whole list: an oklch() or lch() string returns null today. See
parsing.
React Native is not supported
The components render DOM elements, react-dom is a peer dependency, and the
popover goes through createPortal. There is no React Native build and none has
been announced.
Do not read this page as a plan
Every heading above describes the package as it is on 0.1.3. None of it says anything about what a later version will do.
Before 1.0
The package follows semantic versioning, and the
releases page lists what counts as a
breaking change: documented props, entry point exports, and the --cp-* custom
properties and data-cp-* attributes. On 0.x that is the aim rather than a
guarantee, so read the notes for a release before you take it, and pin the patch
range if you would rather review changes first.
npm install chroma-panel@~0.1.3Anything not listed in the API reference — internal class names, for instance — can change in a patch. The changelog is the record of what actually shipped.
Have a say
The repository has issues turned on. GitHub Discussions is not enabled, so an issue is the one place to raise something.
- A bug: open an issue with the version, the browser, and the smallest component that reproduces it.
- A feature: describe the use case and show the code you are writing now, along with what you want to write instead. A request that arrives as a title — "add OKLCH support" — leaves the maintainer guessing at what you actually need. The same request with a component in it does not.
- A question: the FAQ covers the common ones. If yours is not there, an issue works for that too.