IntellureIntellure
🎨

Color Code Converter

Convert colors between HEX, RGB, HSL, and RGBA formats. Visual picker with Tailwind matches.

R
G
B
rgb(99, 102, 241)
H
S
L
hsl(239, 84%, 67%)
Alpha:
rgba(99, 102, 241, 1)
hsla(239, 84%, 67%, 1)

CSS Variable

--color: #6366F1;

Closest Tailwind Class

indigo-500(#6366F1)

Usage: bg-indigo-500, text-indigo-500, border-indigo-500

Color Information

CSS Named ColorNo exact match
BrightnessLight(luminance: 0.185)
Contrast vs White
4.47:1Fail
Contrast vs Black
4.70:1AA

About Color Code Converter

Free color code converter that instantly converts colors between HEX, RGB, HSL, RGBA, and HSLA formats. Enter a color in any format and see all other representations update in real-time. Use the visual color picker for intuitive selection, or type exact values in individual R/G/B or H/S/L input fields. See a large color preview, copy any format with one click, get the closest Tailwind CSS color class match, and check contrast ratios against white and black backgrounds. The tool also identifies named CSS colors and whether the color is light or dark. Perfect for web designers, front-end developers, and anyone working with colors across different CSS and design formats.

Frequently Asked Questions

What color formats are supported?▾
The tool supports HEX (#RRGGBB), RGB (0-255 per channel), HSL (hue 0-360, saturation/lightness 0-100%), RGBA (RGB with alpha transparency 0-1), and HSLA (HSL with alpha transparency). All formats update in real-time when you change any value.
How does the Tailwind color matching work?▾
The tool compares your selected color against the full Tailwind CSS color palette and finds the closest match by calculating the color distance. It suggests the nearest Tailwind class name like 'blue-500' or 'red-400' for quick use in your Tailwind projects.
What is the difference between RGB and HSL?▾
RGB defines colors by Red, Green, and Blue channel intensities (0-255). HSL defines colors by Hue (color wheel position, 0-360°), Saturation (color intensity, 0-100%), and Lightness (brightness, 0-100%). HSL is often more intuitive for adjusting colors — for example, making a color lighter or more muted.

Related Tools

🔢

Binary/Hex/Decimal Converter

Convert numbers between binary, hexadecimal, decimal, and octal.

📐

Unit Converter

Convert between units of length, weight, temperature, volume, and more.

📋

CSV to JSON Converter

Convert CSV data to JSON format online. Supports custom delimiters and file upload.

📊

JSON to CSV Converter

Convert JSON arrays to CSV format. Flatten nested objects with dot notation.

🤖

AI Prompt Generator

Generate perfect AI prompts for ChatGPT, Claude, Midjourney, DALL·E, and coding assistants.

📧

AI Cold Email Generator

Generate personalized cold emails with subject lines for B2B outreach, sales, and partnerships.

Browse all 50+ free tools