Irodori彩り

The color atelier · Irodori 彩り

Free Color Picker: Extract colors from any image instantly.

Upload, paste, or enter a URL to get HEX, RGB, HSL, OKLCH, Lab and CMYK — no signup needed.

Pick a color Browse colors

Runs entirely in your browser. No upload, no account.

朱砂 zhū shā #C3272B สีแสด si saet #EE8B2B 황 hwang #F5B22E 若竹 wakatake #6BA24A Xanh xanh #007A3D 孔雀绿 kong que lu #2E8B72 Biru biru #3A6EA5 जामुनी jamuni #6B3F8C Ягаан yagaan #D96A8B

Live workbench

Start with any color

Drop an image or type a value. Every format updates as you move.

We think data protection is important! Your image stays on your device.

Selected color

HEX#104E8B
RGBrgb(16, 78, 139)
HSLhsl(210 79% 30%)
DetailsCheck contrast

Palette

10 colors Click a color to copy it or replace it with a pick.
#104E8B#A9D1E3#007A3D#F5B22E#C3272B#77428D#FCE9EE#3A3A40#6A5ACD#D6E8EE

One color, every language

Read the same color six ways

HEX for CSS, RGB for screens, HSL for palettes, CMYK for print, OKLCH and Lab for perceptual work. All calculated on your device.

Open the converter

Asian color traditions

Colors that already have names

Nine Asian color traditions — from Japanese seasons to Thai weekday colors, Tibetan pigments, Indian festivals, Mongolian steppe hues and Indonesian batik — each with its native name, reading and exact HEX.

Japanese traditional colors 藍 · 群青 · 空色 22
Chinese traditional colors 天青 · 月白 · 缥 22
Korean traditional colors 청 · 적 · 황 15
Vietnamese traditional colors Đỏ · Vàng · Trắng 7
Thai traditional colors สีแดง · สีเหลือง · สีชมพู 10
Tibetan traditional colors 白云 · 蓝天 · 红火 10
Indian traditional colors केसर · हल्दी · गुलाल 10
Mongolian traditional colors Хөх · Цагаан · Улаан 10
Indonesian batik colors Soga · Nila · Putih 10
Explore the atlas

Real systems

Matched to the palettes you ship

Six design systems, sourced from their official files — not approximated.

Material Design tones 89 Material Web v0.192 · md-ref-palette Tailwind CSS palette 286 Tailwind CSS v4 · theme.css UnoCSS palette 264 UnoCSS preset-mini · Tailwind v3 + Windi Panda CSS tokens 242 Panda CSS · @pandacss/preset-panda Vanilla Extract theme 3 vanilla-extract · createTheme docs example StyleX tokens 6 StyleX · defineVars docs example Bootstrap colors 29 Bootstrap v5.3.8 · _variables.scss Ant Design colors 130 Ant Design · @ant-design/colors 7.2.1 Open Color 130 Open Color 1.9.1 · open-color.js Chakra UI colors 100 Chakra UI · @chakra-ui/theme 3.4.1 Radix Colors 360 Radix Colors 3.0.0 · light scales Fluent UI brand 64 Fluent UI · @fluentui/tokens brandColors Primer colors 20 Primer · @primer/primitives 11.10.0 light Polaris colors 192 Shopify Polaris · polaris-tokens 9.4.2
All tools

Accessibility

Contrast is a color decision

Check WCAG ratios and simulate four kinds of color vision before you ship.

WCAG 2.2AA 4.5:1AAA 7:121:1
Check contrastWCAG contrast Simulate color blindnessColor blindness simulation

Frequently asked questions

How do I pick a color from an image?
Upload your image, paste it from the clipboard, or enter an image URL. Then click anywhere on the image to get the color in HEX, RGB, HSL, OKLCH, Lab and CMYK.
What is a HEX color code?
A HEX color code is a six-digit hexadecimal number that represents red, green and blue channels, for example #FF5733. It is the most common format in CSS, design tools and brand guidelines.
Is this color picker free?
Yes, every tool on this site is free. No signup is required, and your images are processed entirely in your browser — nothing is uploaded to a server.
Which color formats are supported?
HEX, RGB, HSL, OKLCH, Lab, LCH, CMYK, XYZ, LUV and HWB, plus WCAG contrast ratios and color-blindness simulation.
Can I use these colors in my own designs?
Yes. Color values themselves are not protected; copy any value and use it in your CSS, UI, print or illustration work.

Your next palette starts here.

Free, private and fast. No sign-up required.

Open the color picker