UUUP Tools

Design Tools

Color Converter — HEX, RGB, HSL Online

Convert colors among HEX, RGB, HSL, HWB, CMYK, and CSS variables in your browser. Includes a color picker and random color helper for design handoff, stylesheet work, and brand-color alignment.

Quick switch→Palette Generator
ColorHEXRGB
Quick switch:Palette GeneratorCSS Gradient GeneratorColor Harmonizer

Favorite this tool

No favorite storage mode has been selected.

Quick actions

Back to Design Tools Browse all tools

Copy this tool URL or open the system share sheet on a supported device.

Use cases

  • Convert a design-tool color into CSS-ready formats
  • Switch among HEX, RGB, and HSL to match a style guide
  • Export a CSS variable snippet for theme config

How to use

  1. Pick a color or enter HEX, RGB, or HSL text
  2. Review HEX, RGB, HSL, HWB, CMYK, and related outputs
  3. Click any output row to copy its value

Example input and output

Input

#0d9488

Output

rgb(13, 148, 136) / hsl(174, 84%, 32%) / --color: #0d9488;

FAQ

Which input formats are supported?

Supports #HEX, rgb(), hsl() text, and the color picker. Output includes HEX, HEX8, RGB, HSL, HWB, CMYK, and a CSS variable example.

Can I edit transparency?

Conversion focuses on opaque colors. HEX8 includes a fixed FF alpha channel for display compatibility and is not a full alpha editor.

Tools

Related tools

Continue with another translated tool for a nearby task.

Palette Generator

Palette Generator — Rule-Based Color Sets

Available

Generate palettes with monochrome, analogous, complementary, triadic, or fully random rules. Lock individual swatches and keep randomizing the rest for UI exploration and brand-color derivatives.

Palette Color Harmony
Open tool

CSS Gradient Generator

CSS Gradient Generator — Linear, Radial, Conic

Available

Visually build linear, radial, and conic CSS gradients. Adjust angle and stop positions, add multiple stops, and copy CSS for backgrounds, buttons, and brand transitions.

CSS Gradient Background
Open tool

Color Harmonizer

Color Harmonizer — Classic Harmony Rules

Available

Pick a base color and generate schemes with complementary, analogous, triadic, tetradic, split-complementary, or monochromatic rules. Preview UI usage and export CSS variables for brand and component work.

Palette Color Harmony
Open tool