#1980E6rgb(25, 128, 230)Explore digital HSL colors on an interactive hue wheel and export harmonious palettes as PNG or CSS variables.
Find a base color. Explore its harmony.
Drag to select hue · Arrow keys ±1° · Shift ±10°
Home 0° · End 359° · Page Up/Down ±10°
#RGB or #RRGGBB · Invalid text keeps the last valid color.
Complementary · 2 colors
#1980E6rgb(25, 128, 230)#E68019rgb(230, 128, 25)Harmonies use digital HSL angles, not pigment mixing. Saturation/lightness apply to all swatches; at zero saturation or extreme lightness, harmony colors can coincide. This focuses on palette exploration rather than the existing Color Picker’s format-conversion workflow.
HEX entry preserves the full RGB color using fractional HSL values. Display labels round to three decimal places; palette calculations keep their precision. Processing and exports stay in your browser—no uploads.
Enter your values locally; no inputs are uploaded.
Check validation feedback before reviewing the browser-generated result.
Review the explanation, copy supported outputs or reset the workspace.
Enter or select the applicable settings, interact or generate locally, then review the result and explicitly reveal, copy, print or export as appropriate.
Explore digital HSL colors on an interactive hue wheel and export harmonious palettes as PNG or CSS variables. Pointer/keyboard hue selection, shared saturation/lightness and five schemes: complementary (0/180°), analogous (0/−30/+30°), triadic (0/120/240°), split-complementary (0/150/210°) and rectangular tetradic (0/60/180/240°). Existing color conversion/format utilities normalize HEX/RGB values. Live previews and copy controls expose actual palette values. Exports are genuine 1024×512 PNG swatches with labels or CSS variables in the same order. This is a digital HSL wheel, not pigment mixing or a replacement for every Color Picker conversion. At zero saturation or extreme lightness, harmony colors coincide. Clipboard/native rendering depend on browser capabilities; values remain selectable. No file uploads or external processing.
Inputs, random outcomes, participant names, assignments and colors stay in browser memory. No external processing, accounts, emails, server storage or content analytics are used. Reset/unmount clears session state; downloaded or printed files remain on the user’s device. Ordinary page requests may still be logged.
Drag/click the circular hue wheel or use its keyboard arrows, Home/End and Page Up/Down controls. Hue, saturation and lightness sliders update the selected color and every harmony swatch immediately.
Complementary uses 0/180 degrees; analogous 0/−30/+30; triadic 0/120/240; split-complementary 0/150/210; rectangular tetradic 0/60/180/240. Angles wrap around the digital HSL wheel.
All swatches share saturation and lightness. At zero saturation they become gray; at minimum/maximum lightness they become black/white regardless of hue. This is expected HSL behavior rather than an invented replacement palette.
Each swatch displays actual HEX and RGB values with copy buttons, and the full CSS variable block can also be copied. Clipboard access requires browser support/permission; displayed values remain selectable for manual copying.
Download CSS variables in displayed palette order, or create a genuine 1024×512 PNG with colored swatches and HEX/RGB labels. The PNG preview displays that actual encoded file. All rendering and download preparation happen locally.
Color Wheel focuses on visual hue exploration and harmony relationships. It reuses existing color normalization/format utilities but does not reproduce the Color Picker’s entire conversion workflow. Its HSL relationships describe digital RGB colors rather than paint/pigment mixing.
Explore digital HSL colors on an interactive hue wheel and export harmonious palettes as PNG or CSS variables.
Pointer/keyboard hue selection, shared saturation/lightness and five schemes: complementary (0/180°), analogous (0/−30/+30°), triadic (0/120/240°), split-complementary (0/150/210°) and rectangular tetradic (0/60/180/240°). Existing color conversion/format utilities normalize HEX/RGB values. Live previews and copy controls expose actual palette values. Exports are genuine 1024×512 PNG swatches with labels or CSS variables in the same order. This is a digital HSL wheel, not pigment mixing or a replacement for every Color Picker conversion. At zero saturation or extreme lightness, harmony colors coincide. Clipboard/native rendering depend on browser capabilities; values remain selectable. No file uploads or external processing.
Drag/click the circular hue wheel or use its keyboard arrows, Home/End and Page Up/Down controls. Hue, saturation and lightness sliders update the selected color and every harmony swatch immediately.
Complementary uses 0/180 degrees; analogous 0/−30/+30; triadic 0/120/240; split-complementary 0/150/210; rectangular tetradic 0/60/180/240. Angles wrap around the digital HSL wheel.
All swatches share saturation and lightness. At zero saturation they become gray; at minimum/maximum lightness they become black/white regardless of hue. This is expected HSL behavior rather than an invented replacement palette.
Each swatch displays actual HEX and RGB values with copy buttons, and the full CSS variable block can also be copied. Clipboard access requires browser support/permission; displayed values remain selectable for manual copying.
Download CSS variables in displayed palette order, or create a genuine 1024×512 PNG with colored swatches and HEX/RGB labels. The PNG preview displays that actual encoded file. All rendering and download preparation happen locally.
Color Wheel focuses on visual hue exploration and harmony relationships. It reuses existing color normalization/format utilities but does not reproduce the Color Picker’s entire conversion workflow. Its HSL relationships describe digital RGB colors rather than paint/pigment mixing.