🎮
design
Pixel Art Maker
Create pixel art with a grid-based drawing canvas. Features draw, erase, and fill tools, 10-color palette, mirror mode, and PNG export at multiple scales.
pixel art
Use Tool → 🎨
design
Color Wheel Interactive
Pick colors from an interactive wheel and explore complementary, analogous, triadic, and split-complementary harmonies.
color wheelinteractive color wheelcolor harmoniescomplementary colorscolor picker wheel
Interactive color wheel
Explore colors with the interactive color wheel
Click on the wheel to pick a color, then see complementary, analogous, triadic, and split-complementary harmonies.
Color harmonies
Color values
HEX #ff0000
RGB 255, 0, 0
HSL 0°, 100%, 50%
HSV 0°, 100%, 100%
How to use
How to Use the Interactive Color Wheel
- 1 Click anywhere on the color wheel to pick a color.
- 2 Or type a hex color code in the input field and press Enter.
- 3 View the selected color in HEX, RGB, HSL, and HSV formats.
- 4 Explore color harmonies: complementary, analogous, triadic, and split-complementary.
- 5 Click any harmony swatch to copy its hex code.
The interactive color wheel uses the HSL (Hue, Saturation, Lightness) color model. Hue is the angle on the wheel (0-360°), with red at 0°, green at 120°, and blue at 240°. Saturation increases from the center (white) to the edge (full color). The wheel renders using HTML5 Canvas with radial gradients for smooth color transitions.
Color harmonies are combinations that naturally look good together. Complementary colors are opposite on the wheel (180° apart) — they create high contrast. Analogous colors are neighbors (30° apart) — they create subtle, harmonious palettes. Triadic colors are evenly spaced (120° apart) — they create vibrant, balanced schemes. Split-complementary uses the two colors adjacent to the complement (150° and 210°) — it offers contrast with less tension.
More Design tools
Related tools
You might also like
🎨
design
Color Palette from Image
Extract a color palette from any uploaded image using K-means clustering. Get dominant colors as HEX and RGB values with CSS variable code ready to copy.
color palette from image
Use Tool → 👁️
design
Color Blindness Simulator
Simulate how colors appear to people with different types of color vision deficiency. Test color contrast for accessibility compliance.
color blindness simulator
Use Tool → 📊
converter
JSON to CSV Converter
Convert JSON arrays to CSV and CSV to JSON instantly in your browser. Download CSV files with one click.
json to csv
Use Tool →