Color Contrast & Design Utilities

Check accessibility contrast, convert HEX to RGB, and extract colors.

All Tools

Choose from our collection of free, accurate tools

Minify HTML

The Day My Images Stopped Loading (And What Fixed It) It started with a client call at 7 AM on a Tuesday. The…

Use Tool →

SQL to MongoDB

When Your Brain Still Thinks in SQL but Your Database Is MongoDB There is a specific kind of frustration that…

Use Tool →

Hex to RGB

From #FF5733 to rgb(255, 87, 51): Why Designers Live Inside Hex to RGB Converters Every designer has been the…

Use Tool →

YAML to JSON

What Exactly Does a YAML to JSON Converter Do? At its core, a YAML to JSON online converter reads your YAML-f…

Use Tool →

XML Formatter

Why Developers Keep an XML Formatter Tab Open All Day There is a particular kind of frustration that comes fr…

Use Tool →

JSON to CSV

When Your Photo Metadata Lives in JSON and Your Client Wants a Spreadsheet Every photographer who has ever wo…

Use Tool →

CSV to JSON

The Myths People Believe About Converting CSV to JSON (And What Actually Happens) Every developer has been th…

Use Tool →

Markdown to HTML

Plain Text to Browser-Ready Markup: What Actually Happens Inside a Markdown-to-HTML Converter Most people rea…

Use Tool →

HTML to Markdown

Stop Copy-Pasting Broken Markup: When HTML to Markdown Actually Saves Your Day There's a specific kind of fru…

Use Tool →

Online Code Editor

Coding in the Browser: What Online Code Editors Actually Do for Image Work There's a particular kind of frust…

Use Tool →
🔄

HEX to RGB Converter

Convert any HEX color code to RGB, HSL, and CMYK instantly with a live preview swatch. No libraries needed — …

Use Tool →
🎨

Image Color Picker

Upload any image and instantly pick exact pixel colors in HEX, RGB, and HSL format. Features zoom, eyedropper…

Use Tool →
🌈

Color Palette Extractor

Upload any photo and instantly extract 5–10 dominant colors as copyable HEX swatches, ranked by how much each…

Use Tool →
🔍

Image Metadata Viewer (EXIF)

Instantly inspect hidden EXIF, IPTC, and image metadata in any JPEG or PNG — camera model, GPS coordinates, t…

Use Tool →
🧹

EXIF Metadata Remover

Strip GPS coordinates, camera details, and all hidden EXIF metadata from your photos instantly — no uploads, …

Use Tool →

Image Alt Text Generator

Generate SEO-friendly, accessible alt text for your images using a guided template with live character counti…

Use Tool →
🔄

HEX RGB HSL Converter

Convert any color between HEX, RGB, HSL, and CMYK instantly with a live preview swatch and one-click copy for…

Use Tool →
🏷️

Image SEO Filename Optimizer

Turn messy camera filenames like IMG_4821.jpg into clean, keyword-rich SEO slugs that help search engines fin…

Use Tool →
🖼️

Dominant Color Finder

Upload any image and instantly find its single most dominant color and overall average color — complete with …

Use Tool →
⚖️

Contrast Ratio Checker

Instantly test any text and background color pair against WCAG AA and AAA accessibility standards with a live…

Use Tool →
📍

Image GPS Location Viewer

Drop any photo to instantly reveal its embedded GPS coordinates and see exactly where it was taken on an inte…

Use Tool →
👁️

Color Blindness Simulator

Upload any image and instantly preview how it appears to people with protanopia, deuteranopia, or tritanopia …

Use Tool →

Colour is a decision, not a decoration

Most tool sites treat colour as a lookup table — paste a hex code, get an RGB triplet, move on. EdiToolkit is built for the people who have to defend those numbers in a design review. When you pull a swatch from a client's photograph, that colour becomes a brand token, a button state, a hover shade, and eventually a line in a stylesheet that thousands of visitors will stare at. Our Image Color Picker exists so you can sample the exact pixel you mean — the highlight on the product, not the shadow beside it — and copy it in HEX, RGB and HSL without squinting at a native eyedropper that snaps to the wrong point. Zoom in, hover, read the value, paste it into your design token. That small act of precision is the difference between a palette that feels intentional and one that feels borrowed.

The Color Palette Extractor and Dominant Color Finder take the same idea further. Drop in a hero photograph, a moodboard, or a competitor's landing page screenshot, and you get five to ten dominant colours ranked by how much of the frame they actually occupy — not a random spread of pretty tints. Designers use this to reverse-engineer a mood, to check whether a photograph will sit comfortably beside an existing brand palette, or to build a scheme that already lives inside the imagery rather than fighting it. Because everything runs in your browser, you can throw unreleased campaign artwork at it without worrying that the file left your machine.

From swatch to system: HEX, RGB, HSL and CMYK

A single colour rarely stays in one format. You picked it in HEX from a mockup, your CSS wants RGB with an alpha channel, your motion designer thinks in HSL because rotating a hue is how they build gradients, and the print vendor only speaks CMYK. The HEX to RGB and HEX RGB HSL Converter tools are here so that translation never becomes a source of drift. Convert once, see a live preview swatch, and copy whichever notation the next tool in your pipeline expects. The HSL view in particular is worth leaning on: it separates hue from saturation and lightness, which means you can build a full tonal ramp — a 100-through-900 scale for a design system — by holding hue steady and stepping lightness, instead of guessing hex codes by eye.

Working in HSL also makes accessibility easier to reason about before you ever open the contrast checker. Lightness is roughly the lever that governs whether text on a background will pass, so nudging that single value gives you a fast, intuitive first pass. When you commit those colours into variables, keep the format consistent across the codebase; mixing raw hex in one component and rgba() in another is how palettes quietly diverge over a year of shipping.

Accessibility is where good colour proves itself

A palette that looks stunning in a Dribbble shot can still fail real people. The Contrast Ratio Checker tests any text-and-background pair against WCAG AA and AAA thresholds — 4.5:1 for normal body text, 3:1 for large headings — and shows the result live as you adjust the colours. Use it the moment you assign a colour to type, not as a compliance chore at the end. A grey that reads as "soft and modern" at 3.2:1 is unreadable for a huge slice of your audience on a sunny day or a cheap laptop panel, and fixing it early costs a nudge of lightness rather than a redesign.

The Color Blindness Simulator answers the question that contrast alone can't: does the design still make sense when hue disappears? Roughly one in twelve men has some form of colour vision deficiency, so previewing your interface through protanopia, deuteranopia and tritanopia filters catches the classic failures — red/green status pills that become identical, charts that rely on hue alone to separate series, error states signalled only by a colour change. Pair it with the Image Alt Text Generator, which walks you through writing genuinely descriptive alt text with a live character count, and you cover both the visual and the semantic sides of an accessible image. Together these turn "we should be accessible" into a checklist you can actually run before launch.

The metadata you can't see is the part that matters

Every photo you export carries a hidden layer: EXIF and IPTC metadata recording the camera, the timestamp, the software, and — most dangerously — GPS coordinates of exactly where the shot was taken. The Image Metadata Viewer lets you inspect all of it, and the Image GPS Location Viewer plots any embedded coordinates on a map so you can see at a glance whether a file is about to reveal a home address or an unannounced office. This isn't paranoia; newsrooms strip metadata as standard practice for precisely this reason, and a single un-scrubbed upload has ended people's anonymity.

The EXIF Metadata Remover closes the loop by stripping that data locally, before the image ever goes near a server, so you can publish clean files without an anxious round-trip through some unknown uploader. Round out the workflow with the Image SEO Filename Optimizer, which turns IMG_4821.jpg into a readable, keyword-aware slug that helps both search engines and screen-reader users. Whether you're a UI designer defending a palette, a front-end developer wiring colour tokens into a system, or an accessibility auditor signing off a release, these tools share one philosophy: colour and images are craft, and craft deserves instruments that respect your attention. Bookmark the ones you reach for, and let the fiddly parts — the conversions, the checks, the scrubbing — happen in seconds so you can spend your time on the decisions that actually need a human.

Color Palette Pro at a Glance

Quick

From input to answer in seconds, every time.

🙌

Free Forever

Open the page and start — no cost, no catch.

📐

Precise

Careful math and methods behind every tool.

📲

Mobile-Ready

Optimized for the phone in your pocket.

Latest from Our Blog