Back to updates
Improved

May 23, 2026

2 min read

@readytools/colors 1.1.0 — Major Feature Update

This release brings powerful new tools that make it even easier for frontend developers to build beautiful, accessible, and modern design systems.

readytools

ReadyTools author

We're excited to ship a significant update to @readytools/colors — our lightweight, zero-dependency color utility library.

This release brings powerful new tools that make it even easier for frontend developers to build beautiful, accessible, and modern design systems.

What's New

  • Full Tailwind CSS Integration New generateTailwindPalette() and generateTailwindConfig() functions. Generate production-ready Tailwind color scales (50–950) from a single base color using perceptually uniform OKLCH color space.
  • Advanced Random Color Generation randomColor() (and alias random()) with full control over hue, saturation, lightness, and alpha ranges. Perfect for dynamic UIs, data visualizations, and playful interfaces.
  • Much Stronger Color Parsing parseColor() now supports modern CSS color functions including oklab() and oklch(), both legacy comma syntax and the new space-separated syntax with / alpha.
  • Improved Developer Experience
    • Better TypeScript support and type exports
    • More comprehensive examples for design systems and dark mode workflows
    • Enhanced documentation with real-world use cases

Key Highlights

  • Still zero dependencies and fully ESM-only
  • Strong focus on modern color science (OKLab / OKLCH)
  • Excellent WCAG accessibility tools (ensureContrast, getContrastColor, etc.)
  • Perceptually uniform color scales and interpolations

Example Usage

CODE
import { generateTailwindConfig, randomColor, ensureContrast } from "@readytools/colors";

// Generate Tailwind-ready palette
const config = generateTailwindConfig("#ff6600", { name: "brand" });

// Smart random colors
const vibrant = randomColor({ 
  hue: [200, 280], 
  saturation: [70, 95], 
  lightness: [45, 65] 
});

// Force accessible contrast
const textColor = ensureContrast("#777777", "#0a0a0a", 7);

@readytools/colors continues to be one of the most focused and modern color libraries available — built specifically for today's frontend workflows with Next.js, Tailwind, and modern CSS.

View on npm

Release summary


Type

Improved

Date

May 23, 2026

Reading time

2 min read

View all updates

More product updates

Explore more recent ReadyTools changes.

View all updates

Top tools

WorkspaceLinksyBoardlyChromoCodeHub

ReadyTools

CareersContactTools
Pricing7 days free
GuidesDocsBlogUpdatesLaraVault

Select Language

Set theme

© 2026 ReadyTools. All rights reserved.