Pick a color on the panel, with the sliders, or by typing a HEX value, and copy HEX, RGB, RGBA, HSL and HSV values plus a ready CSS line. Tints and shades of your color are shown too.
Your files are processed in your browser, on your own device. Nothing is uploaded to a server.
A Color Picker lets you choose a color and read it in every format your work needs. Pick on the panel, move the RGB sliders, or type a HEX value, and ToolPeko shows HEX, RGB, RGBA, HSL and HSV with copy buttons, all in your browser and free.
The three ways in stay in step. Drag on the panel and the sliders and the HEX box follow. Type a HEX value and the panel and sliders jump to it. Every format row under the picker is worked out from that one picked color, so the rows never disagree.
The CSS line is ready to paste into a stylesheet as a color value. The strip under the rows walks your color toward white on one side and toward black on the other, the usual source of hover states, borders and soft background washes. A set built from the strip looks related without any guesswork.
Brand work is the first case. A logo gives you one color, and the website wants it as HEX, the app wants it as RGB, and a chart library wants HSL so you can lift the lightness for the second bar. Picking the color once and copying each row ends the tour of separate converter tabs.
Building a page is the second. A developer holds a mockup color in one hand and a stylesheet in the other. One pick, one click on the CSS row, and the exact value is sitting in the stylesheet with no transcription slip in the middle. Transcription slips are the quiet bug: one wrong digit gives a green that is almost right, and almost right can take an hour to spot.
Documents and slides are the third. A report chart, a presentation theme or a set of table headers built from the tints and shades reads as a designed set. The strip hands you those related colors without opening a design tool.
Everything on this page is sRGB, the color space of screens. It is the right space for websites, apps and documents, and it is not a print promise. A color that is exact in HEX can land differently in CMYK ink, and no page picker can close that gap. If the work heads to print, treat the values as a starting point for a proof, not the final word.
HSL and HSV are two readings of one color, not two colors. In HSL, lightness runs from black through the pure color to white. In HSV, value runs from black up to the pure color at full strength. The same color gives two different number sets, and both are correct. Designers reach for HSL when they want lighter and darker versions, since the lightness number maps to that job.
The numbers are exact and your screens are not. Two monitors show the same HEX value a touch apart, and an older screen can dull a saturated color. That is a display limit, not a picking error. When a color has to match across machines, match by the numbers on this page and not by eye across two screens. Two close relatives live on this site when all you need is a conversion: the HEX to RGB converter and the RGB to HEX converter.
The picking and the math run in your browser. Colors are not sent to a server, not stored by ToolPeko and not tied to an account. There is no daily cap, and only the value you copy to your clipboard leaves the page.
Both describe the same color by hue. HSL uses lightness, which runs from black to white with the pure color in the middle. HSV uses value, which runs from black up to the pure color. This page shows both.
Every row has its own copy button. Pick the color, click the button on the HEX, RGB, RGBA, HSL, HSV or CSS row, and paste it into your stylesheet, app settings or document. Nothing needs retyping.
Yes. Type a HEX value in the box and the panel and the sliders move to that color. It is the fastest way to match a color a designer handed you.
Tints are your color walked toward white, and shades are the same color walked toward black. They give you lighter and darker relatives for hover states, borders and backgrounds in the same family.
Yes. The CSS row gives the color as a stylesheet-ready value. Copy it and drop it into a color or background rule and the value is exact, digit for digit.
With care. This picker works in sRGB, the screen color space. Print runs on CMYK ink, and colors can shift. Use the values as a starting point and check a printed proof before a run.
Same rules as this one: free, in your browser, with nothing uploaded.
Paste messy JSON, get it neat and valid.
Check JSON and find the exact line that breaks it.
Squeeze JSON down to one tight line.
Open JSON as a tree you can fold and explore.
JSON rows turned into a CSV a spreadsheet can open.
A CSV file turned into clean JSON objects.
JSON rewritten as YAML for config files.
YAML config turned into JSON you can use in code.