Modern Color Picker Built for Designers

Color Picker Pick any color and instantly get HEX, RGB, HSL, HSV, and CMYK codes plus the nearest color name. Color Code Converter Paste a HEX, RGB, HSL, or CSS color name and convert it to every other color format. HEX to RGB Converter Convert HEX color codes to RGB and RGBA values with a step-by-step breakdown of the math. RGB to HEX Converter Turn red, green, and blue values into a HEX color code, including 3-digit shorthand. Color Palette Generator Generate a 5-color UI palette with primary, secondary, accent, and neutral roles from one base color. Color Contrast Checker Check the contrast ratio of text and background colors against WCAG AA and AAA. Gradient Generator Create smooth two-color linear gradients and copy the CSS in one click. Image Color Picker Upload an image and click anywhere to get the exact HEX and RGB color of that pixel. HEX Opacity Calculator Add transparency to any color and get 8-digit HEX, RGBA, and HSLA values instantly. CSS Box Shadow Generator Design CSS box shadows visually with offset, blur, spread, color, and inset controls. Color Shades Generator Generate a 10-step scale of lighter and darker shades of any color for design systems. Tint, Tone and Shade Generator See the tints, tones, and shades of any color side by side with copy-ready values. Complementary Color Finder Find the complementary and split-complementary colors of any color for strong contrast. Color Harmony Generator Generate analogous, triadic, tetradic, split-complementary, and monochromatic color schemes. Color Wheel Tool See where your color sits on the color wheel along with its complement and triadic partners. Color Mixer Mix two colors by any ratio and get the blended color, a blend scale, and CSS color-mix(). Random Color Generator Generate random colors with HEX, RGB, and HSL codes for instant inspiration. Random Color Palette Generator Generate random yet harmonious 5-color palettes for fast creative exploration. Pastel Color Generator Generate soft pastel color palettes for gentle, elegant, and friendly designs. Neon Color Generator Generate bright neon colors and copy glowing text and button CSS effects. Multi-Color Gradient Generator Build three-stop linear gradients with a middle color and copy-ready CSS. CSS Gradient Code Generator Generate linear, radial, and conic gradient CSS code with a solid-color fallback. Animated Gradient Generator Create animated CSS gradient backgrounds with keyframes and reduced-motion support. Gradient Border Generator Create CSS gradient borders that work with rounded corners and copy the code. Tailwind CSS Color Generator Turn any color into a Tailwind 50–950 shade scale for tailwind.config.js or @theme. Glassmorphism CSS Generator Generate frosted glass UI effects with transparency, backdrop blur, and copy-ready CSS. Button Color Generator Generate hover, active, focus, and disabled button colors with accessible text. Light & Dark Theme Previewer Preview an accent color in light and dark themes side by side and copy the theme CSS. Image to Palette Extractor Upload an image to extract its dominant color palette, processed privately in your browser. Color Name Finder Find the closest CSS color name for any HEX or RGB code, with the top 5 matches. HTML Color Names Browse and search all 148 HTML and CSS named colors with HEX and RGB values. Color Inverter Invert any color to its negative and compare it with the true complementary color. Typography Contrast Tool Test text color readability at real font sizes and weights against WCAG rules. Color Blindness Simulator Simulate how two colors look with protanopia, deuteranopia, tritanopia, and achromatopsia.