Extract hex, RGB, and HSL color codes from any image. Build custom palettes with a simple click. No signup needed.
Hex (#FF5733) is the most common web format — 6 characters representing red, green, and blue channels. RGB (rgb(255, 87, 51)) uses decimal values 0-255 for each channel and is standard in CSS. HSL (hsl(11, 100%, 60%)) describes hue, saturation, and lightness — the most intuitive format for adjusting colors. All three produce the same color; choose based on your workflow.
Upload a reference photo (a landscape, product shot, or design inspiration), then click different areas to sample colors. Add each color to your palette using the "Add to Palette" button. Aim for 5-7 colors: a primary, secondary, accent, and neutral tones. Copy all hex values at once for use in your design tool, CSS, or brand guidelines.
Need to match a client's exact brand color? Upload their logo and click on the colored areas. The eyedropper gives you the precise hex code — no more guessing "is that #1DA1F2 or #1A91DA?" This is especially useful when recreating designs, matching print materials, or building style guides.
Designers can extract colors from mockups, screenshots, and reference images directly in the browser — no need for Photoshop or a standalone color picker app. The tool outputs CSS-ready values (hex, rgb, hsl) that you can paste directly into your stylesheet. Works with JPG, PNG, and WebP files.