chroma.js

JavaScript library for color conversion, manipulation, and scale generation

Library
npm
v3.2.0
10,607 stars
BSD 3-Clause License

Repository Health

Pre-computed score based on development activity, maintenance, community, maturity, and trend momentum. How we score it →
65 /100 Good
Development Activity 48
Maintenance 40
Community 72
Maturity 60
Momentum 40

Technical Analysis

AI-assessed by reading the actual repository — architecture, code quality, innovation, and documentation. How we score it →
76 /100 Good
Architecture 76
Code Quality 74
Innovation 70
Learning Curve 84

chroma.js is a small library for all kinds of color operations in the browser and Node.js: converting between color spaces (RGB, HSL, LAB, LCH, HSV, and more), reading colors from CSS strings, named colors, or hex/temperature values, and generating smooth color scales and palettes for maps and charts. It bundles the classic ColorBrewer palettes and X11/CSS named colors out of the box, so data-visualization projects can pull in perceptually reasonable color ramps without hand-picking hex values.

The library exposes a chainable chroma() API for building up color transformations (darken, brighten, saturate, mix, blend) and a chroma.scale() API for interpolating between colors across a domain, commonly used to color choropleth maps, heatmaps, and data-driven charts.

What You Get

  • Color parsing and conversion across RGB, HSL, HSV, LAB, LCH, CMYK, and named/hex/CSS color strings
  • A chainable color-manipulation API (darken, brighten, saturate, desaturate, alpha, mix, blend)
  • A chroma.scale() API for building continuous or discretized color scales/gradients between multiple colors
  • Built-in ColorBrewer palettes and X11/CSS named colors ready to use as scale inputs
  • Color-distance and contrast utilities for accessibility and perceptual-difference checks

Common Use Cases

  • Coloring choropleth maps and heatmaps by interpolating a value across a color scale
  • Generating data-visualization color palettes (sequential, diverging, categorical) from ColorBrewer presets
  • Programmatically lightening, darkening, or blending brand colors for hover/active UI states
  • Converting user-supplied or design-token colors between formats (hex, RGB, HSL) for theming systems

Under The Hood

Architecture: The chroma() factory in Color.js normalizes any input format through src/io/input.js, which dispatches to per-space parsers under src/io/ (hex, css, named, cmyk, hsl, hsv, lab, lch, gl, num), converting everything to an internal RGB representation that manipulation methods (darken, saturate, mix) and src/generator/src/interpolator scale logic operate on before re-serializing back out through the same io modules on demand. Tech Stack: Written in modern JavaScript (ESM, ships both index.js ESM and dist/chroma.cjs CJS/UMD builds via Rollup), with a handful of legacy .coffee files still present in the io layer (delta-e, distance) alongside newer plain-JS modules, built and tested with pnpm and Vitest. Code Quality: A large test/ directory (50+ files) covers each color-space converter and the scale/interpolation logic individually, giving good regression coverage for a library where subtle color-math bugs are easy to introduce; the codebase shows its age in a mix of coding styles (CoffeeScript remnants alongside ES modules) reflecting over a decade of incremental maintenance. API Design: The chainable chroma(color).method().method() style and the single chroma.scale() entry point for gradients keep the common cases terse, though the breadth of supported color-space names and options makes the full API surface non-trivial to memorize without consulting docs.

Used by 25 apps in this directory

TypeScript
100%
Apache 2.0

ILLA Builder

Design Tools · Developer Tools · Low Code Platforms

12,333

Open-source low-code platform for building internal tools with drag-and-drop UI, reactive data bindings, and real-time collaboration.

View details
55
Repo Health
71
Technical
63
Dependency
Built with
TypeScript 100%
Updated 5 months ago
TypeScript
98%
MIT

isoflow

Design Tools · Developer Tools

1,728

A React component that lets developers embed a fully-featured, isometric network diagram editor directly into their applications.

View details
41
Repo Health
72
Technical
70
Dependency
Built with
TypeScript 98%
Updated 1 years ago
TypeScript
98%
Other

Kibana

Analytics · Monitoring

21,338

Your open source window into the Elastic Stack — query, visualize, and act on data stored in Elasticsearch with real-time dashboards, AI-assisted search, and automated alerting.

View details
98
Repo Health
87
Technical
63
Dependency
Built with
TypeScript 98%
Updated 6 days ago
TypeScript
39%
Apache 2.0

Label Studio

AI Development · Data Engineering

28,540

Label Studio is an open-source, multi-type data labeling platform that lets teams annotate images, text, audio, video, and time series data with a configurable XML-based UI and export annotations in formats ready for any ML framework.

View details
93
Repo Health
87
Technical
64
Dependency
Built with
TypeScript 39%
JavaScript 27%
Python 25%
Updated 1 weeks ago
TypeScript
96%
Other

Langfuse

AI Development · Monitoring

36,276

Open source AI engineering platform for LLM observability, prompt management, evaluation, and debugging — self-host in minutes or use Langfuse Cloud.

View details
92
Repo Health
81
Technical
65
Dependency
Built with
TypeScript 96%
Updated 6 days ago
TypeScript
96%
MIT

likec4

Developer Tools · Devops

5,954

Define your software architecture as code and get always up-to-date, interactive C4 diagrams generated automatically from a DSL.

View details
89
Repo Health
83
Technical
78
Dependency
Built with
TypeScript 96%
Updated 6 days ago
TypeScript
98%
Other

LobeHub

AI Assistants · Automation · Productivity

83,455

Your Chief Agent Operator — build, schedule, and collaborate with an entire AI team in one self-hostable workspace.

View details
92
Repo Health
81
Technical
65
Dependency
Built with
TypeScript 98%
Updated 6 days ago
TypeScript
81%
AGPL 3.0

massCode

Code Editors · Developer Tools · Productivity

7,085

A free, local-first developer workspace unifying snippets, notes, HTTP requests, calculations, drawings, and dev tools in one desktop app.

View details
85
Repo Health
87
Technical
62
Dependency
Built with
TypeScript 81%
Vue 17%
Updated 2 weeks ago
PHP
78%
GPL 3.0

matomo

Analytics

21,976

Open-source, privacy-first web and app analytics that puts you in complete control of your data.

View details
95
Repo Health
82
Technical
62
Dependency
Built with
PHP 78%
Updated 1 weeks ago

Join founders buildingwith open source

Opinionated takes, migration guides, cost-saving tips, and insights from the open source ecosystem.

Subscribe on Substack
Join 750+ subscribers