Color Recall
FREE
Play the color memory game everyone's talking about. We show you 5 colors, you recreate them from memory using HSB controls.
Color Tools
Pick colors, build harmonious palettes, and validate WCAG contrast without leaving the browser. This category lists 46 free color tools for product UI, branding, and accessible web design—pair pickers with tint/shade generators and compare tools before handoff.
Practice color skills with browser games
Pair palette and contrast tools with short color games. Memorize swatches on Dialed, match harmonies on Method Color, then validate picks with converters and compare tools.
Dialed Color Game
FREEPlay the color game on dialed.gg: a color match game to memorize five swatches, test color memory, and match colors online—solo, color daily, or multiplayer.
Color
FREEPlay the color method game on color.method.ac: matching color games for hue, saturation, and harmony—color guessing with complementary and triadic rounds.
Hex Test
FREEPlay Hex Test on madebyshape.co.uk: guess the hex code from swatches in this hex code game—10-level color code quiz and colour code game.
Color Review
FREERun a color review in context: simulate color blindness, check WCAG contrast, and refine pairs. color.review
Accessible Brand Colors (ABC)
FREEBuild an ADA compliant color palette from brand swatches. Test ADA colors, accessible orange pairs, and WCAG contrast with Use All Five ABC.
Alphredo
FREEGenerate alpha colors that match opaque swatches on your background. Alphredo—HSLA, HEX, and JSON export for CSS tokens and Figma.
CCColor
FREEConvert hex to HSL, RGB, and HSB. Get clear hex codes and transparent color values with fffuel CCColor—copy CSS-ready color codes instantly.
Palitra
FREEExplore color palettes on palitra.app with a simple browser workflow. Confirm exports and terms in the live app before you lock tokens.
Picular
FREEBuild a color palette from words on Picular: search a mood or subject and sample hues from image results. Try the official
Pppalette
FREESeasonal color palettes: autumn, summer, winter, and spring schemes with complementary and analogous harmonies. Copy HEX, HSL, RGB.
ColorDrop
FREEBrowse named color palettes on colordrop.io—peacock green, icy blue, muted green, dusty purple, and neon orange. Copy HEX from Colordrop in the browser.
Colordot
FREEPick colors with Colordot on color.hailpixel.com—color dot, hue and saturation gestures, and HEX for CSS. Minimal hailpixel picker.
Eva Design Colors
FREEGenerate Eva colors and a design system color palette from a primary on colors.eva.design. Semantic UI scales for token handoff and contrast checks.
Goodpalette
FREEGenerate UI color palettes on Goodpalette. Explore combinations for design systems, plus duotone Shape Factory how-to on goodpalette.io.
Happy Hues
FREEExplore Happy Hues for cute colors, happy color palettes, and hue colors in sample UI. Copy hex codes and browse fun, joyful palette ideas.
Tints and Shades
FREECreate tints and shades from any hex. Build color shading scales in 5%, 10%, or 20% steps—export HEX, RGB, CSS, or JSON in your browser.
Colorion
FREEBrowse colorion.co—two tone color, dual color, double complementary schemes, and CSS gold gradient buttons. Named palettes and HEX.
Color Palette Builder
FREEColor palette generator on ColorDesigner: triad, split-complementary, monochromatic harmonies. Create wedding color schemes in one click.
Gradient Generator
FREEBuild green, purple-to-blue, black-to-white, and CSS gradients with ColorDesigner's gradient generator. Copy HEX, RGB, HSL, and stepped color values.
Grabient
FREEMake CSS gradient backgrounds with Grabient: edit stops, angles, and copy linear-gradient code. beside uiGradients presets and other color tools.
ColorSpace
FREEGenerate space color palettes and CSS gradients on ColorSpace (mycolor.space). One-color schemes, 3-color blends, green and black gradient ramps.
Gradient Hunt
FREEDiscover gradient UI on Gradient Hunt: best gradient colors, good gradient combinations, and two-color pairs for heroes and cards. Browse.
Color Mixer
FREEUse a color mixing chart and color wheel mixer in the browser. ColorDesigner Color Mixer—paint mixing, blends, and HEX output.
Hue Tools Mix
FREEMix two colors with a live ratio slider and copy HEX output instantly. Use Hue Tools Mix to test transitions, accents, and interface color combinations.
Hue Tools Info
FREEUse Hue Tools Info to inspect and understand color details with HEX-focused output. Great for quick validation, comparison, and design-to-code handoff.
Hue Tools Modify
FREEUse Hue Tools Modify to adjust and refine colors in a HEX-focused workflow. Validate updates quickly before applying them to UI themes and tokens.
Hue Tools Blend
FREEUse Hue Tools Blend to blend colors and inspect intermediate HEX values for UI themes, gradients, and design token workflows.
Huemint Brand Intersection
FREEAI brand color palettes: contrast targets, lockable swatches, iterative exploration for brand identity color systems. Third-party; open if blocked.
Color Name Finder
FREEPick any color and find its nearest name across multiple naming libraries, including HTML, X11, NTC, Pantone, and basic color sets with ColorDesigner.
Color Converter
FREEConvert hex to RGB, hex to CMYK, and hex to HSL in the browser. ColorDesigner color converter—CMYK, LAB, HSV, and RGB pairs in one tool.
Color Palette From Image
FREEGet a color palette for image uploads, URLs, or clipboard paste. Extract dominant colors and copy HEX with ColorDesigner.
Lighten Color
FREEGet a lighter color from any hex. Lighten color toward white with an amount slider—copy lighter hues as HEX, RGB, or HSL in your browser.
Darken Color
FREEGet a darker color from any hex. Darken color with an amount slider—preview dark hues, copy darker shades as HEX, RGB, or HSL in your browser.
Change Color Saturation
FREESaturate color or desaturate any hex. Change saturation with a −100 to +100 slider—copy values as HEX, RGB, or HSL in your browser.
Greyscale Desaturate Color
FREEConvert any hex to grayscale color instantly. Desaturate color with full color desaturation—copy grayscale hex codes as HEX, RGB, or HSL.
Invert Color
FREEUse this color inverter to invert colors from any hex instantly. Get RGB negative output and copy inverted hex codes as HEX, RGB, or HSL.
Tetrad Color Scheme
FREEBuild a tetradic color scheme from any hex. See tetrad colors in square and rectangular sets—copy four harmonious HEX, RGB, and HSL values instantly.
Square Color Scheme
FREEGenerate a square color scheme from any hex. Build a square color wheel set with four evenly spaced hues and copy square colors as HEX, RGB, and HSL.
Random Color Generator
FREEGenerate random hex colors, rainbow picks, and multi-color sets on ColorDesigner. Copy HEX, RGB, and HSL from the random color generator.
RandomA11y
FREEBrowse RandomA11y for WCAG contrast-safe pairs and accessible color combinations. Generate random foreground and background sets.
Color Wheel
FREEBuild color wheel triads, square schemes, and HSV harmonies. ColorDesigner color wheel—complementary, analogous, and more.
Colorkit
FREEColorkit.io: tints and shades generator, color combiner, mix chart, overlay, RGB slider. Build UI ramps and hex mixes.
Color Leap
FREEBrowse 1940s color palette swatches and 1940s colors by decade. Color Leap—history color codes and era palettes for design and illustration.
Colour Contrast Checker
FREEColour contrast analyser for background and foreground pairs. Live WCAG ratio, pass or fail grades, hex RGB and HSL controls, and text preview.
Coolors Trending Palettes
FREEBrowse Coolors trending color palettes—skin tone, rainbow, pastel, monochromatic, and more. Shortlist popular combinations for UI and brand work.
Color Scheme Generator
FREEGenerate color schemes from any hex, compare harmony models, copy palette CSS variables, and download JSON for design work.
CSS Gradient Generator
FREECreate linear and radial CSS gradients, edit color stops, copy background code, and download SVG gradient references.
Compare Colors
FREECompare colors on ColorDesigner: hex color compare, Delta E color difference calculator, and side-by-side distance scores for design QA and handoff.
Color Palette Generator
FREEGenerate visually balanced color palettes with the ColorDesigner Color Palette Generator and export practical color sets for design systems and UI workflows.
Looking for external products and SaaS platforms? Browse curated products.
About Color Tools
Pick colors, build harmonious palettes, and validate WCAG contrast without leaving the browser. This category lists 46 free color tools for product UI, branding, and accessible web design—pair pickers with tint/shade generators and compare tools before handoff. You can explore each tool page to understand the use case, output format, and how to reuse results in design and frontend projects.
How teams use Color Tools
Workflows for palettes, WCAG contrast, and accessible UI color.
Accessible text and UI states
Run contrast checks on body copy, buttons, and focus rings before shipping—catch AA/AAA failures early in the design system.
Palette exploration for brand work
Generate tints, shades, and harmonies from a seed color, then export hex values into Figma variables or CSS custom properties.
Validate picks with browser games
Practice hue memory and harmony matching with color games in the Design Games category, then confirm choices with converters here.
Related tool categories
Browse other categories to find complementary tools for your workflow.
SVG Generators
Free SVG generators for gradients, patterns, waves, noise, and backgrounds—browser tools for web layouts and design exports.
Design Games
Interactive browser games for color, typography, layout skills, and visual thinking practice.
Image & Conversion
Image converters, resize and crop tools, GIF utilities, OCR, tracing, and format conversion in the browser.
Programming
CSS animation references, easing editors, grid generators, SVG coding guides, and Unicode tools for front-end work.
Icons & Graphics
Icon libraries, iconography sets, open-source illustrations, and SVG asset collections for product UI and marketing.
Font Tools
Font conversion, @font-face helpers, inspection utilities, and typography tools for web and print.
Frequently Asked Questions
Quick answers about this tool—open a question to read more.