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.
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.