css-color-to-rgb | Convert any CSS color to RGB & Hex

The Ultimate CSS Color Parser

A utility to convert any CSS color into an RGB array and hex code by leveraging the browser's native rendering engine.

Why a Different Approach?

Instead of custom parsing, we let the browser do the heavy lifting. This ensures perfect accuracy and future-proof support for all modern CSS color syntax.

Maximum Compatibility

If your browser can render it, this library can parse it. From `color-mix()` to `display-p3`, it just works.

Always Accurate

The results match exactly what you see on the screen, eliminating discrepancies between parsing logic and browser rendering.

Zero Maintenance

As browsers add support for new CSS color functions, the library automatically supports them without needing updates.

Live Demo

Enter any CSS color value below to see the magic happen.

CSS Color Value:

RGB Array

[255, 0, 0]

Hex Code

#ff0000

Try these examples:

Get Started in Seconds

Installation

$ pnpm add css-color-to-rgb
# or npm or yarn
                    

Usage

import { cssColorToRgb, cssColorToHex } from "css-color-to-rgb";

const rgb = cssColorToRgb("blue"); 
// [0, 0, 255]

const hex = cssColorToHex("hsl(0, 100%, 50%)");
// "#ff0000"
                    

Notes & Limitations

Browser Dependency: Results depend on the CSS features supported by the user's browser. Different browsers or versions may return slightly different RGB values for the same color input.

Alpha Channel Handling: Colors with alpha transparency (like `rgba()`) are composited with a white background. The output will always be a solid RGB value reflecting this blend.