Skip to main content
@ooneex/color is a tiny color helper for the browser and server. It converts hex color codes into CSS rgba() strings (with optional alpha) and ships a fixed palette of pleasant, named colors you can use for tags, avatars, charts, and other UI accents.

​
Installation

Add the package with Bun. 
bun add @ooneex/color

​
Usage

Use hexToRgba to turn any hex code into an rgba() string. It accepts 3, 4, 6, or 8 digit hex (with or without a leading #) and returns null when the input is invalid. 
import { hexToRgba } from "@ooneex/color";

hexToRgba("#3B82F6");        // "rgba(59, 130, 246, 1)"
hexToRgba("3B82F6");         // "rgba(59, 130, 246, 1)" (# is optional)
hexToRgba("#F00");           // "rgba(255, 0, 0, 1)" (shorthand expands)
hexToRgba("#3B82F6", 0.5);   // "rgba(59, 130, 246, 0.5)" (explicit alpha)
hexToRgba("#3B82F680");      // "rgba(59, 130, 246, 0.502)" (alpha from hex)

hexToRgba("not-a-color");    // null
hexToRgba("#3B82F6", 2);     // null (alpha must be between 0 and 1)
The package also exports a curated palette and a map of human-readable names. SIMPLE_COLORS is a readonly tuple of hex codes, and SIMPLE_COLOR_NAMES maps each one to its label. 
import {
  SIMPLE_COLORS,
  SIMPLE_COLOR_NAMES,
  hexToRgba,
  type SimpleColorType,
} from "@ooneex/color";

// Pick a deterministic color for a label, then build a faded background.
const colorForTag = (tag: string): SimpleColorType => {
  const index = tag.length % SIMPLE_COLORS.length;
  return SIMPLE_COLORS[index];
};

const hex = colorForTag("billing");          // e.g. "#10B981"
const name = SIMPLE_COLOR_NAMES[hex];         // e.g. "Green"
const background = hexToRgba(hex, 0.12);      // "rgba(16, 185, 129, 0.12)"

​
When to use it

  • You need to apply a hex color with transparency in inline styles or canvas, e.g. hexToRgba(hex, 0.2) for hover/background tints.
  • You want a small, consistent set of distinguishable colors for tags, categories, charts, or avatar backgrounds without hand-picking values.
  • You need to safely validate and normalize user-supplied hex input (invalid values return null instead of throwing).
  • You don’t need it if you only ever use static CSS colors or a design system that already provides token-based color utilities.