What it does
Huetone is an MIT-licensed colour-system editor with lightness, chroma and hue controls. It compares colour relationships, switches between CIELCH and OKLCH views and exports CSS variables or JSON tokens.
Paste a colour or edit its numeric L, C and H values. Arrow keys select another swatch; holding L, C or H with an arrow adjusts the corresponding channel. Rows and columns can be moved or duplicated with modifier-key shortcuts. Holding B previews the palette in greys.
Chart settings switch the colour model and show P3 or Rec. 2020 boundaries. The hexadecimal field turns red for a colour outside sRGB. Copy tokens produces JSON, while Copy CSS variables provides a stylesheet handoff. The editable JSON palette field also accepts a replacement palette.
Huetone’s help identifies APCA as a developing contrast method. Its results must remain distinct from a WCAG 2 contrast-ratio result. Local setup uses Yarn, and the repository contains the application’s help and export implementation.
Strengths
- Perceptual channels and keyboard controls support systematic edits.
- Exports include CSS variables and JSON design tokens.
Watch out for
- An APCA result is not a WCAG 2 contrast-ratio pass.
Best for
- Design-system work requiring deliberate colour relationships
Sources
- Huetone repository and local setup (Oct 27, 2026)
- Huetone MIT licence (Oct 27, 2026)
- Huetone in-app help source (Oct 27, 2026)
- Huetone export controls (Oct 27, 2026)
- Huetone chart settings (Oct 27, 2026)
- Huetone colour editor (Oct 27, 2026)
