Color Tools & References

Free color conversion, accessibility, and reference tools for web developers and designers.

All Tools

Hex to RGB Converter

Convert hex color codes to RGB, HSL, and CMYK values instantly. Supports both 3-digit and 6-digit hex codes with live color preview. Includes the conversion formula, common color values table, and CSS usage examples.

RGB to HSL Converter

Convert RGB color values to HSL (hue, saturation, lightness) format. Understand the HSL color model, see the conversion algorithm, and learn why HSL is preferred for palette generation. Includes ready-to-use CSS hsl() output.

Color Contrast Checker

Check WCAG 2.1 color contrast ratios for accessibility compliance. Test text and background color combinations against AA (4.5:1) and AAA (7:1) standards. Includes the luminance calculation formula and practical tips for fixing low contrast.

Tailwind CSS Color Reference

Complete reference for the default Tailwind CSS color palette. All 22 color families with hex values across 11 shade levels (50-950). Learn how to customize colors in tailwind.config.js and implement effective dark mode color strategies.

CSS Gradient Generator

Generate CSS linear and radial gradients with custom angles and multiple color stops. Covers gradient syntax, direction options, multi-stop techniques, layered gradients, and browser compatibility.

Code Complexity Analyzer

Measure cyclomatic complexity, cognitive complexity, nesting depth, and line count for JavaScript, Python, and Java code. Color-coded scores with function-level breakdown table and refactoring suggestions for high-complexity blocks.

Regex Tester

Build and debug regular expressions with live match highlighting, capture group display, and execution time. Includes a full cheatsheet sidebar and quick-insert buttons for character classes, quantifiers, anchors, and common patterns like email, URL, and ISO date.

Main Tool

Looking for the palette generator? Head to the Color Palette Generator to create harmonious 5-color palettes with export to CSS, Tailwind, SCSS, and JSON.

Built by Michael Lip. 100% client-side.

By the same builder: GitHub — theluckystrike BeLikeNative — Grammar AI EarlyThunder — Dev Blog Bug Bounty Reality Zovo — AI Dev Tools