UD5 Toolkit
Browser Color Gamut Test - Online P3 or sRGB?
Check if your browser and display support the wider DCI‑P3 color space. See the difference with a simple test pattern.
Color Tools - Palette & Picker
99+ toolsImage Palette Extractor (Paste) - Online Clipboard Image
Paste an image from your clipboard directly into the page (Ctrl+V) and extract its color palette. No file dialog needed.
Image Color Extractor - Online Palette from Picture
Upload an image and extract its dominant colors or full color palette. Download as a CSS snippet or color swatch. Entirely client-side, your images stay private.
Live Color Mix Blender - Online Mix Two Colors Visually
Pick any two colors and blend them proportionally with a slider. Get the resulting hex, RGB, and HSL. Pure client‑side.
Random Color Naming Challenge - Online Eye Test
See a random color and type its name. Score based on accuracy. Fun for designers. Local.
Color to CIELAB Converter - Online Perceptual Space
Convert hex or RGB to CIELAB L*a*b* values. Understand perceptual lightness and color opponents. Local math.
Mix‑Blend‑Mode Playground - Online CSS Effect Tester
Pick two images or colors and apply all 16 CSS mix‑blend‑mode values live. See and copy the right CSS for your design.
Website Color Theme Extractor - Online Grab Palette from CSS
Fetch a website's CSS and extract :root custom properties (‑‑color) to reveal its design token palette. For learning and inspiration.
HTML Color Names - Online Complete List with Hex & Preview
A complete, searchable list of all 140+ named HTML/CSS colors with their hex codes and color previews. Click to copy code. Essential web reference.
Online Color Picker - Eye Dropper & Color Selection Tool
Pick colors from a palette or use the eye dropper to sample colors from your screen. Converts between HEX, RGB, HSL. An essential tool for designers.
Color Name Finder - Online Hex to Name Dictionary
Find the official name of any hex color from the extended color dictionary. Search by name to get the hex code. Handy for CSS and design language.
3D RGB Color Cube - Online Interactive Space
Explore the RGB color space as a rotatable 3D cube. Pick a color directly from the volume. Drag to rotate. Canvas 3D.
Random Palette from Image URL - Online Surprise Colors
Enter the URL of any image and receive a random harmonious palette extracted from it. Click to regen. For quick inspiration.
Color Temperature to RGB - Online Kelvin to Hex Converter
Enter a Kelvin value (1000‑40000) and see the approximate white‑balance color. Photography and lighting reference.
Accessible Color Contrast Finder - Online WCAG 2.1 Helper
Given a background color, this tool suggests foreground colors that meet AA/AAA contrast ratios. Works for all vision types.
Pigment Mixing Simulator - Online Color Blending Tool
Mix two or more colors using subtractive (CMYK‑like) blending. See what happens when you combine real paints. Brush effect canvas.
RGB to CMYK Converter - Online Print Color Translator
Convert screen RGB colors to print-ready CMYK values. Understand color shifts before printing. Ideal for graphic designers preparing artwork for press.
RGB to HEX Converter - Online Color Translator
Convert RGB and RGBA color values to their HEX or HEX+alpha representation. Live preview and copy CSS color strings instantly.
Color to OKLCH Converter - Online Perceptually Uniform
Convert hex, RGB, or HSL into the modern OKLCH color space. See the preview and copy CSS oklch() value. Local.
Accessible Palette Checker - Online Simulate & Recommend
Paste a set of hex colors and simulate how they appear with common color vision deficiencies. Get contrast warnings.
Gradient Previewer - Online Instant CSS Background Viewer
Paste or write a CSS gradient value and instantly see the rendered output. Debug and iterate on gradients quickly. Local preview.
Color Harmony Chooser - Online Complementary & Triadic
Find complementary, triadic, analogous, and split-complementary color combinations. Interactive color wheel. Essential for UI design.
Color Blindness Simulator - Online Vision Deficiency Preview
Simulate how images and UI elements appear to users with various types of color blindness. Upload or paste image URL. Promote inclusive design.
Relative Luminance Calculator - Online WCAG Metrics
Enter a hex color and get its relative luminance per WCAG definition. Understand why this matters for contrast.
Image Color Picker From URL - Online Remote Picture Analyzer
Enter the URL of any online image and extract its dominant colors or pick colors with a magnifier. No upload, cross‑origin friendly.
Color Gamut Viewer - Online See sRGB vs Display P3
See the chromaticity diagram and compare sRGB, DCI‑P3, and your display. Fun for design geeks.
Perceived Brightness Calculator - Online Luminance Formula
Calculate the perceived brightness of an RGB color and determine if black or white text is more readable. Accessibility tool.
Color Inversion Calculator - Online Exact Opposite Hue
Get the exact RGB inversion (negative) of any color. Useful for dark mode theming and high‑contrast accessibility checks.
Hex Color Clock - Online Time Displayed as Background Color
Every second, the background color changes to the hex code corresponding to the current time (HHMMSS). A beautiful, ever‑changing clock.
Color Palette Generator - Online Random & Harmonious Colors
Discover beautiful color palettes for your projects. Generate random, complementary, or trendy schemes and copy hex codes. Useful for designers and developers.
Image Color Palette from URL - Online Remote Photo Analysis
Enter an image URL and extract its dominant color palette. No download needed. Fast visual analysis.
Color Meaning by Culture - Online Cross‑Cultural Reference
See how a color is interpreted in different cultures (e.g., red in China vs. Western). Crucial for global web design. Static guide.
Color Contrast Checker - Online WCAG Accessibility Validator
Check the contrast ratio between foreground and background colors to ensure web accessibility compliance. Get WCAG 2.1 AA/AAA pass/fail results instantly.
Color Swatch to CSS - Online Palette to Variables
Paste a list of hex colors and generate CSS custom properties for them. Create your design token file instantly.
Stepped Color Shade Generator - Online Tailwind‑Style Palette
Pick a base color and generate a full palette of 10 shades (50 to 900) like Tailwind CSS. Copy as hex or hsl.
Interactive Color Wheel - Online Learn Color Theory
An interactive color wheel that teaches primary, secondary, tertiary colors, and harmonies. Pick and mix like a pro.
Color Guessing Game - Online RGB to Color Challenge
Given an RGB value, pick the matching color square. Multiple difficulty levels. Improve your color perception. Fun for designers.
Colorblind Friendly Palette Checker - Online Simulate & Advise
Enter a color palette and see how it looks for different types of color vision deficiency. Get warnings on conflicting colors.
Extract Colors from Image URL - Online Palette Generator
Paste a direct link to an image and get its 5 dominant colors with hex codes. No upload, uses canvas with CORS proxy.
CSS color-mix() Playground - Online Function Generator
Experiment with the CSS color-mix() function. Pick two colors and mix them in different color spaces (srgb, oklch). Copy the CSS.
Color Trend Inspector - Online Pick Year & See Palette
See the Pantone Colors of the Year and popular palettes from past years. Get hex codes. Design inspiration.
Famous Brand Colors - Online Quick Reference Palette
Search a library of famous company brand colors with hex codes. Copy any color instantly. For designers and marketers.
Hue Rotation Calculator - Online Shift CSS Filter Value
Enter original and target color to compute the exact CSS hue‑rotate(deg) filter needed. For precise icon and image tinting.
HEX to RGB Converter - Online Color Code Translator
Quickly convert HEX color codes to RGB values and vice versa. See the color preview. Indispensable for web developers and graphic designers.
CMYK to Pantone Converter - Online Approximate Match
Enter CMYK values and find the closest Pantone Solid Coated color. For print design reference. Client‑side lookup.
CSS Color Function Explorer - Online Write Modern Colors
Write modern CSS color functions like oklch(), lab(), hwb() and see the rendered color with fallback. Copy compatible code.
3D Color Space Viewer - Online Explore RGB Cube
Rotate and explore the RGB color space as a 3D cube. Pick colors directly from the volume. Interactive Three.js.
CIELAB to RGB Converter - Online Bring Color Back
Enter L*a*b* values and see the corresponding RGB and hex color. Useful for advanced color manipulation.
HSV Color Picker - Online Traditional Hue Wheel
Classic HSV color wheel with sliders. See hex, RGB, and HSL equivalents. Intuitive for artists. No server interaction.
Curated Random Color Palette - Online Designer‑Approved Sets
Get a beautiful, hand‑picked color combination instead of purely random. Each palette has a name and copyable hex codes.
CMYK Color Preview - Online See Print vs Screen
Preview how a CMYK value will look on screen (approximate). Compare with its RGB equivalent. Pre‑press check.
HEX to HSL Converter - Online Color Code to Hue Saturation Lightness
Translate HEX colors to HSL values and adjust lightness and saturation visually. Great for creating color variations in CSS design systems.
Color Harmony Picker - Online Complementary Split‑Comp
Choose a base color and see its complementary, split‑complementary, triadic, and tetradic harmonies. Copy palettes. Local.
Accessible Color Contrast Grid - Online Test Combinations
Enter a palette of colors and see a grid showing whether each foreground/background pair passes AA or AAA contrast. Must for designers.
Screen Color Picker - Online Eyedropper with Magnifier
Use the browser's native eyedropper tool to pick any color from the screen. Shows zoomed preview. Quick and easy.
Tint & Shade Generator - Online Lighter & Darker Colors
Generate tints (add white) and shades (add black) for any base hex color. Copy values for design systems. Instant local generation.
APCA Contrast Checker - Online New Accessible Perceptual Contrast
Check the Accessible Perceptual Contrast Algorithm (APCA) ratio. The next‑generation contrast method for WCAG 3.
CSS Relative Color Playground - Online Manipulate Colors
Write CSS like `oklch(from red l c h)` to modify colors dynamically. Preview the output and copy the code.
System Colors Cheatsheet - Online All CSS System Colors
View all CSS system colors (Canvas, ButtonFace, GrayText) as swatches. Click to copy. For forced‑colors adaptation.
Pixel Art Color Picker - Online Palette for Spriters
A dedicated color picker with common retro gaming palettes (NES, Gameboy). Pick and copy hex codes. For pixel art creators.