UtilitiesTools

Color

Pick, name, convert and check colors.

Color tools take the guesswork out of working with color on the web and in design. Convert a HEX code to RGB or HSL, pick a shade visually and copy its exact value, find the name of a color, or check that two colors have enough contrast to stay readable and accessible. They are built for front-end developers translating a design into CSS, designers building a palette, and anyone making sure text passes WCAG contrast requirements. Every conversion happens instantly in your browser with no uploads and no sign-up. Use the HEX to RGB converter to drop values straight into your stylesheet, a color picker to grab the perfect shade, or a contrast checker to confirm your UI is legible for everyone. Free, fast, and made to give you a copy-ready answer in seconds.

Illustration for the Color tools category

14 tools

All tools →
Anthropic Color Palette The full Anthropic / Claude brand color palette with names and hex codes — copy any color as HEX/RGB/HSL or export the whole set as CSS, Tailwind, SCSS or JSON. Background Color Finder Paste or fine-tune one color and instantly get a curated set of background colors that go with it — tinted neutrals, soft complements, light and dark options — each scored live for WCAG contrast, with a real preview, one-tap HEX copy, and a CSS-pair copy action. Color Namer Paste, pick, or eyedrop any color and instantly learn its real name, color family, and the vocabulary to describe it. Color Names Browse a gallery of 4,930 named colors grouped by family (reds, oranges, greens, teals, blues, purples...), tap any swatch to copy its hex, and learn the vocabulary behind the names. Color Palette Generator Pick one base color and instantly get six color-theory schemes (complementary, analogous, triadic, split-complementary, tetradic, monochromatic) with one-tap HEX / RGB / HSL copy. Color Picker Pick any color and instantly get its HEX, RGB, HSL, HSV and alpha values, each with one-tap copy. Color Picker From Image Upload or paste any image, click a pixel, and instantly get its HEX/RGB/HSL value, the name of that color, and an auto-extracted palette — all in your browser, image never uploaded. Contrast Checker Check the exact WCAG contrast ratio, get text and UI/graphics verdicts, and apply the smallest lightness-only foreground or background repair when a pair fails. CSS Generator Pick one color, see it styled live on a 16:9 page mock, fine-tune every element, verify strict WCAG AA text contrast, then copy the CSS or an exact-state share link for your LLM or teammate. CSS Gradient Generator Build a linear or radial CSS gradient, preview it live, and copy ready-to-paste background CSS. HEX to RGB Converter Paste a HEX, RGB, or HSL value and get the other two formats live in the same view, plus the color's nearest real name. Leo's Font System Copy Leo's typography brief, inspect each preferred font in context, and use the exact font roles for web pages, videos, subtitles, quotes, signatures, and body text. Leo's Visual Palette Copy Leo's complete visual palette brief, or copy each color by hex value and full role sentence for design handoff and AI prompts. Random Color Generator Roll a random color or a palette of up to 10, each with HEX, RGB, and HSL — lock the keepers and re-roll the rest.

Browse other categories

← Home All tools