Ruang warna—daftar lengkap 221 ruang, konverter & rumus

import space from 'color-space'

space.rgb.oklch(255, 128, 0)      // → [0.732, 0.186, 53]
space.oklch.rgb(0.65, 0.1, 180)   // → [56.14, 162.97, 145.41]
space.oklch.range                 // [[0,1], [0,0.4], [0,360]]

Atau satu ruang saja—bundelnya tidak memuat apa pun selain itu.

import oklch from 'color-space/oklch.js'

oklch.rgb(0.65, 0.1, 180)   // → [56.14, 162.97, 145.41]

Bertipe: deklarasi TypeScript disertakan dalam paket, untuk seluruh pustaka maupun untuk tiap ruang secara terpisah.

WebAssembly

Untuk gambar utuh dan buffer panjang: 54 ruang, 53 kB setelah gzip, 1.4–4.8× lebih cepat daripada batch JS pada 26 konversi yang diukur.

import space, { alloc } from 'color-space/wasm'

space.oklch.rgb(0.72, 0.16, 41)   // → [246, 125, 79]

const buf = alloc(n)              // n×3 Float64Array
space.rgb.oklch(buf)              // in place

Modul ini tidak mengimpor apa pun, jadi berjalan di mana pun WebAssembly berjalan: peramban, Node, Deno, Bun—serta Python, Rust, atau Go melalui wasmtime atau wasmer.

import struct
from wasmtime import Store, Module, Instance   # pip install wasmtime

store = Store()   # color-space.wasm: the npm package's dist/
cs = Instance(store, Module.from_file(store.engine, 'color-space.wasm'), []).exports(store)

at = cs['alloc'](store, 1.0) & 0xFFFFFFFF   # the buffer: n×3 float64 in the kernel's memory
cs['memory'].write(store, struct.pack('3d', 255, 128, 0), at)
cs['rgb_lrgb_n'](store, 1.0)                # in place, edge by edge: rgb → linear rgb → oklab
cs['lrgb_oklab_n'](store, 1.0)
struct.unpack('3d', cs['memory'].read(store, at, at + 24))   # (0.732, 0.112, 0.148)

Dikompilasi oleh jz

Ruang rgb, lrgb, xyz, xyz-d50, xyy, lms, p3, p3-linear, rec2020, rec2020-linear, a98rgb, a98rgb-linear, prophoto, prophoto-linear, rec709, hsl, hsv, hwb, oklab, oklrab, oklch, oklrch, lab, lchab, lab-d65, lch-d65, din99o-lab, din99o-lch, luv, lchuv, hsluv, hpluv, cam16, hct, ycbcr-bt709, ycbcr-bt2020, jzazbz, jzczhz, ictcp, ictcp-hlg, ipt, din99d, acescg, acescct, acescc, awg3, logc3, logc4, slog3, vlog, log3g10, clog2, ryb, munsell

Shader

Semua 221 ruang sebagai fungsi shader. Konversi ke rgb menghasilkan 0–255, seperti di JavaScript: bagi dengan 255 untuk warna fragmen.

WebGL dan OpenGL: GLSL.

import { glsl } from 'color-space/gl'
import oklch from 'color-space/gl/oklch'

const frag = `#version 300 es
precision highp float;
${glsl(oklch, 'rgb')}
out vec4 color;
void main() { color = vec4(oklch_rgb(vec3(0.7, 0.15, gl_FragCoord.x)) / 255.0, 1.0); }`

WebGPU: WGSL.

import { wgsl } from 'color-space/gl'

const code = wgsl(oklch, 'rgb') + `
@fragment fn main(@builtin(position) p: vec4f) -> @location(0) vec4f {
  return vec4f(oklch_rgb(vec3f(0.7, 0.15, p.x)) / 255.0, 1.0);
}`

DirectX, Unity, dan Unreal: HLSL. Metal: MSL. Keduanya dihasilkan dari WGSL oleh naga, dependensi opsional.

import { hlsl } from 'color-space/gl/hlsl'   // npm i naga-wasm
import { msl } from 'color-space/gl/msl'

await hlsl('oklch', 'rgb')   // float3 oklch_rgb(float3)
await msl('oklch', 'rgb')    // metal::float3 oklch_rgb(metal::float3)

Server MCP

Untuk agen AI: agen memanggil konversi yang sudah terverifikasi alih-alih menebaknya.

npx -y color-space mcp

// Claude Code
claude mcp add color-space -- npx -y color-space mcp
// VS Code
code --add-mcp '{"name":"color-space","command":"npx","args":["-y","color-space","mcp"]}'
// Claude Desktop · Cursor · .mcp.json
{ "mcpServers": { "color-space": { "command": "npx", "args": ["-y", "color-space", "mcp"] } } }

Teruji dengan acuansetiap ruang diuji dengan nilai acuan

Dua arahruang apa pun ke ruang lain mana pun

RinganSekitar 1 kB per ruang

Domain publikCC0

Alat	Ruang	Log kamera	Luma–kroma	sRGB	Fitur	Ukuran	Kecepatan	Target
color-space	205	31	16	0–255	`parse` `mix` `ΔE` `contrast` `CVD`	62 kB		JS, WASM, GL, LUT, ICC, OCIO, MCP, Figma, VS Code, CLI, web
culori	30	–	1	0–1	`parse` `mix` `gamut` `ΔE` `contrast` `CVD`	23 kB		JS
colorjs.io	51	–	–	0–1	`parse` `mix` `gamut` `ΔE` `contrast`	34 kB		JS, web
chroma-js	11	–	–	0–255	`parse` `mix` `ΔE` `contrast` `palettes`	17 kB		JS
@texel/color	16	–	–	0–1	`parse` `gamut` `ΔE`	9 kB		JS
colour-science	128	24	6	0–1	`ΔE` `CVD`	–	–	Python, LUT
ColorAide	77	–	–	0–1	`parse` `mix` `gamut` `ΔE` `contrast` `CVD` `palettes`	–	–	Python
colorspace (R)	9	–	–	0–1	`mix` `contrast` `CVD` `palettes`	–	–	R, web
OpenColorIO	57	11	–	0–1	`gamut`	–	–	C++, Python, GL, LUT, ICC
Bruce Lindbloom	22	–	–	0–1, 0–255	`ΔE`	–	–	web
oklch.com	9	–	–	0–255	`parse` `gamut`	–	–	web

Alat

Ruang

Log kamera

Luma–kroma

sRGB

Fitur

Ukuran

Kecepatan

Target

color-space

205

0–255