# @soybeanjs/colord

> A tiny yet powerful tool for high-performance color manipulations and conversions

Latest version **0.8.0** (published 2026-09-18) · MIT license · 0 weekly downloads

## Install

```sh
npm install @soybeanjs/colord
pnpm add @soybeanjs/colord
yarn add @soybeanjs/colord
bun add @soybeanjs/colord
```

## Health

**Score 55/100 (C)** — status: active.

Positive: no vulnerabilities; recently updated; high maintenance score.

Warnings: low downloads; no types; no esm support; pre 1.0.

## Facts

| | |
|---|---|
| Version | 0.8.0 |
| Published | 2026-09-18 |
| First published | 2026-01-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 19 |
| Author | Soybean |
| Maintainers | honghuangdc |

## Links

- npm: https://www.npmjs.com/package/@soybeanjs/colord
- Repository: https://github.com/soybeanjs/colord
- Issues: https://github.com/soybeanjs/colord/issues
- npm.io page: https://npm.io/package/@soybeanjs/colord

## Recent versions

- 0.8.0 (latest) — 2026-09-18
- 0.7.1 — 2026-08-10
- 0.7.0 — 2026-08-10
- 0.6.2 — 2026-06-13
- 0.6.1 — 2026-06-11
- 0.6.0 — 2026-06-11
- 0.5.0 — 2026-04-06
- 0.4.2 — 2026-02-06
- 0.4.1 — 2026-02-06
- 0.4.0 — 2026-02-06
- 0.3.5 — 2026-01-18
- 0.3.4 — 2026-01-17
- 0.3.3 — 2026-01-17
- 0.3.2 — 2026-01-17
- 0.3.1 — 2026-01-17
- … 12 more at https://npm.io/package/@soybeanjs/colord/versions

## README

# @soybeanjs/colord

<strong>Colord</strong> is a tiny yet powerful tool for high-performance color manipulations and conversions. fork from [colord](https://github.com/omgovich/colord)

## Features

- 📦 **Small**: Just **1.7 KB** gzipped ([3x+ lighter](#benchmarks) than **color** and **tinycolor2**)
- 🚀 **Fast**: [3x+ faster](#benchmarks) than **color** and **tinycolor2**
- 😍 **Simple**: Chainable API and familiar patterns
- 💪 **Immutable**: No need to worry about data mutations
- 🛡 **Bulletproof**: Written in strict TypeScript and has 100% test coverage
- 🗂 **Typed**: Ships with [types included](#types)
- 🏗 **Extendable**: Built-in [plugin system](#plugins) to add new functionality
- 📚 **CSS-compliant**: Strictly follows CSS Color Level specifications
- 👫 **Works everywhere**: Supports all browsers and Node.js
- 💨 **Dependency-free**

## Differences from [colord](https://github.com/omgovich/colord)

- support `oklab` and `oklch` color models, and `oklch` is support directly without extra plugin
- support `palette` API to generate and find the nearest palette color
- more correct color parsing
- simplify type definitions
- rewrite color string parsing
- rename alpha property `a` to `alpha`

## Getting Started

```bash
pnpm i @soybeanjs/colord
```

```ts
import { colord } from '@soybeanjs/colord';

colord('#ff0000').grayscale().alpha(0.25).toRgbString(); // "rgba(128, 128, 128, 0.25)"
colord('rgb(192, 192, 192)').isLight(); // true
colord('hsl(0, 50%, 50%)').darken(0.25).toHex(); // "#602020"
colord({ r: 128, g: 128, b: 128, alpha: 0.25 }).toRgbString(); // "rgba(128, 128, 128, 0.25)"
colord('hsl(210.003, 34.547%, 98.004%)').toOklchString(); // 'oklch(98.4% 0.003 247.858)'
```

## Palette API

```ts
import { generatePalette, generateNearestPalette, parseTailwindColor } from '@soybeanjs/colord/palette';

parseTailwindColor('slate.500'); // { l: 0.55, c: 0.04, h: 257, alpha: 1 }
parseTailwindColor('slate.500', 'hex'); // '#64748b'
generatePalette('red'); // generate the palette of the color 'red'
generateNearestPalette('red'); // find the nearest color in the palette of the color 'red'
```

## Supported Color Models

- Hexadecimal strings (including 3, 4 and 8 digit notations)
- RGB strings and objects
- HSL strings and objects
- HSV objects
- OKLCH objects and strings
- Color names ([via plugin](#plugins))
- HWB objects and strings ([via plugin](#plugins))
- CMYK objects and strings ([via plugin](#plugins))
- LCH objects and strings ([via plugin](#plugins))
- LAB objects ([via plugin](#plugins))
- XYZ objects ([via plugin](#plugins))
- OKLAB objects ([via plugin](#plugins))

## More API

see the more api in [colord](https://github.com/omgovich/colord)

---
_Source: https://npm.io/package/@soybeanjs/colord · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._