What color formats are supported?

The tool outputs HEX (e.g. #3b82f6), RGB (e.g. rgb(59, 130, 246)), and HSL (e.g. hsl(217, 91%, 60%)) formats. Click Copy next to any format to copy it to your clipboard.

What is the color palette?

The palette shows 7 shades of your chosen color — from dark to light — generated by varying the lightness in HSL color space while keeping the hue and saturation constant.

How do I use the gradient generator?

Pick two colors and set the angle. The tool generates a CSS linear-gradient() declaration you can copy and paste directly into your stylesheet.

Can I enter a HEX value manually?

Yes. Type a HEX value directly into the text input next to the color picker. It accepts 3 or 6 character hex codes with or without the # prefix.

What is the difference between HEX and RGB?

HEX is a hexadecimal representation of RGB values, commonly used in CSS. RGB uses decimal values for each color channel. They represent the same colors in different notations.

Can I enter a color value directly?

Yes. You can type a HEX code, RGB values, or HSL values directly into the input fields.

Color Picker — Pick Colors & Generate Palettes Free Online

Pick colors, generate palettes and CSS gradients. Get HEX, RGB, and HSL values instantly. Free online color picker tool.

Pick a color

#3B82F6

HEX

#3B82F6

RGB

rgb(59, 130, 246)

HSL

hsl(217, 91%, 60%)

Color Palette

Click any swatch to use it as the base color

CSS Gradient Generator

Color 1

Color 2

Angle°

background: linear-gradient(135deg, #3b82f6, #8b5cf6);

100% Private

No Upload

Instant

What is Color Picker?

A color picker is a tool that lets you select colors and get their values in different formats (HEX, RGB, HSL). It is essential for web designers, graphic designers, and developers who need precise color values for CSS, design tools, or brand guidelines. Our Color Picker also generates complementary color palettes and CSS gradient code.

How to Use Color Picker

1Click on the color wheel or enter a color value.
2The tool displays the color in HEX, RGB, and HSL formats.
3Copy any color value with one click.
4Use the palette generator to create complementary colors.

Key Features

Interactive color wheel
HEX, RGB, and HSL output
Color palette generator
CSS gradient generator
One-click copy for each format

Benefits

Get precise color values for web design
Generate harmonious color palettes
Create CSS gradients instantly
Match brand colors accurately

Use Cases

HEX vs RGB vs HSL RGB vs CMYK

Why Use Irreva for Color Picker?

Get precise color values for web design

Generate harmonious color palettes

Create CSS gradients instantly

Runs 100% in your browser — files never leave your device.

No account, no sign-up, no subscription — free forever.

Works on any device: desktop, tablet, or mobile.

Frequently Asked Questions

More Developer Tools

Barcode Generator Barcode Scanner Base64 Encoder/Decoder Binary Converter Color Converter Color Palette Generator