Loading
Preparing your generator page
We are loading content and tools so everything is ready to use.
We are loading content and tools so everything is ready to use.
Get random colors with HEX, RGB, HSL, and CMYK codes, the nearest color name, and a text contrast check. Choose pastel, vibrant, dark, or light styles and any color family, lock the colors you love, and export your palette—or test your eye with the guess-the-HEX game.
Also try the Color Palette Generator, Color Code Generator, and HEX Code to Color Name.
Last updated: October 2, 2026 · Published: 2026-04-07 · Updated: 2026-10-02
For designers, developers, artists, and teachers. Browse all Randomizer tools.
Tip: press the space bar to generate.
Pick your options, then generate
A random color generator picks colors at random and gives you their color codes, so you can discover new colors, start a palette, or set a creative challenge.
Muxgen's Random Color Generator can pick any of the 16,777,216 colors a standard screen can display, or one of the 139 named CSS colors. Every color comes with HEX, RGB, HSL, and CMYK values, its nearest color name, and its contrast with white and black text.
Filter by style and color family, lock favorites while you regenerate the rest, and export your palette as CSS variables or JSON. It runs in your browser with no sign-up.
Three steps to your next color.
Pick any color or named colors, how many you want, a style, and a color family.
Click Generate or press the space bar to get 1 to 24 colors with HEX, RGB, HSL, and CMYK values.
Lock colors you like and regenerate the rest, then copy a value or export the palette as CSS or JSON.
Every control in the tool and what it does.
Generate colors, or test your eye with the guessing game.
Any of the 16,777,216 screen colors, or only the 139 named CSS colors.
1 to 24 colors per click.
Pastel, vibrant, muted, dark, light, or any.
Red, orange, yellow, green, teal, blue, purple, pink, or grays.
Make HEX, RGB, HSL, or CMYK the main value on each swatch.
Lock colors to keep them when you regenerate, and sort the palette by hue.
Click a value to copy it, or copy the whole palette as a list, CSS variables, or JSON.
Four ways to write the same color, shown here with coral.
| Format | Example | What it means | Best for |
|---|---|---|---|
| HEX | #FF7F50 | Six hexadecimal digits: two each for red, green, and blue (00 to FF). | Websites, CSS, Figma, Canva, and sharing colors |
| RGB | rgb(255, 127, 80) | Red, green, and blue light, each from 0 to 255. | Screens, CSS, and design software |
| HSL | hsl(16, 100%, 66%) | Hue (0–360° on the color wheel), saturation, and lightness. | Adjusting colors by hand and building themes |
| CMYK | cmyk(0%, 50%, 69%, 0%) | Cyan, magenta, yellow, and black ink percentages. | Print, as a starting point for your printer's profile |
There are 16,777,216 possible HEX and RGB colors: 256 levels each of red, green, and blue.
What each Style option means, with sample colors.
| Style | What it means | Range | Samples |
|---|---|---|---|
| Any | The full range of saturation and lightness. | Saturation 0–100%, lightness 8–92% | |
| Pastel | Soft, light, gently saturated colors, like baby blue and blush pink. | Saturation 40–75%, lightness 78–90% | |
| Vibrant | Bright, fully saturated colors that pop. | Saturation 80–100%, lightness 45–60% | |
| Muted | Dusty, grayed-down colors, like sage and slate. | Saturation 15–40%, lightness 35–65% | |
| Dark | Deep, rich shades, like navy and forest green. | Saturation 30–85%, lightness 12–30% | |
| Light | Pale tints that work well as backgrounds. | Saturation 25–80%, lightness 70–92% |
The hue range for each Color family, with the named colors in it. Very light reds count as pink.
| Family | Hue range | Named colors |
|---|---|---|
| Red | 345°–359° and 0°–12° | Brown, Crimson, Dark Red, Firebrick, Indian Red, Light Coral, Maroon, Red, Rosy Brown, Salmon, Tomato |
| Orange & brown | 13°–40° | Antique White, Bisque, Blanched Almond, Burlywood, Chocolate, Coral, Dark Orange, Dark Salmon, Light Salmon, Linen, Moccasin, Navajo White, Old Lace, Orange, Orange Red, Papaya Whip, Peach Puff, Peru, Saddle Brown, Sandy Brown, Sienna, Tan, Wheat |
| Yellow | 41°–65° | Beige, Cornsilk, Dark Goldenrod, Dark Khaki, Gold, Goldenrod, Khaki, Lemon Chiffon, Light Goldenrod Yellow, Light Yellow, Olive, Pale Goldenrod, Yellow |
| Green | 66°–155° | Chartreuse, Dark Green, Dark Olive Green, Dark Sea Green, Forest Green, Green, Green Yellow, Lawn Green, Light Green, Lime, Lime Green, Medium Sea Green, Olive Drab, Pale Green, Sea Green, Spring Green, Yellow Green |
| Teal & cyan | 156°–195° | Aquamarine, Cadet Blue, Cyan, Dark Cyan, Dark Slate Gray, Dark Turquoise, Deep Sky Blue, Light Blue, Light Cyan, Light Sea Green, Medium Aquamarine, Medium Spring Green, Medium Turquoise, Pale Turquoise, Powder Blue, Teal, Turquoise |
| Blue | 196°–250° | Blue, Cornflower Blue, Dark Blue, Dark Slate Blue, Dodger Blue, Lavender, Light Sky Blue, Light Slate Gray, Light Steel Blue, Medium Blue, Medium Slate Blue, Midnight Blue, Navy, Royal Blue, Sky Blue, Slate Blue, Slate Gray, Steel Blue |
| Purple & magenta | 251°–300° | Blue Violet, Dark Magenta, Dark Orchid, Dark Violet, Indigo, Magenta, Medium Orchid, Medium Purple, Plum, Purple, Rebecca Purple, Thistle, Violet |
| Pink | 301°–344° | Deep Pink, Hot Pink, Light Pink, Medium Violet Red, Misty Rose, Orchid, Pale Violet Red, Pink |
| Grays & neutrals | Saturation under 12% | Alice Blue, Azure, Black, Dark Gray, Dim Gray, Floral White, Gainsboro, Ghost White, Gray, Honeydew, Ivory, Lavender Blush, Light Gray, Mint Cream, Seashell, Silver, Snow, White, White Smoke |
Contrast ratio compares the brightness of two colors, from 1:1 (identical) to 21:1 (black on white). The Web Content Accessibility Guidelines (WCAG) set minimums so text stays readable, including for people with low vision or color blindness.
Every swatch in the generator shows its ratio with white and black text and labels it with the level it meets.
| Level | Contrast ratio | Use for |
|---|---|---|
| AAA | 7:1 or higher | Enhanced contrast for normal text |
| AA | 4.5:1 or higher | Minimum for normal body text |
| AA Large | 3:1 or higher | Minimum for large or bold text and UI parts like icons |
| Fail | Below 3:1 | Too low for readable text |
Classic color wheel rules for combining colors.
Two colors opposite each other on the color wheel (180° apart), like blue and orange. High contrast and energetic.
Three colors next to each other (about 30° apart), like yellow, yellow-green, and green. Calm and natural.
Three colors evenly spaced (120° apart), like red, yellow, and blue. Balanced and playful.
A base color plus the two colors beside its complement. Contrast with less tension.
Tints and shades of a single hue. Simple, elegant, and easy to get right.
Use one color for about 60% of a design, a second for 30%, and an accent for 10%.
Common associations in Western design. Meanings vary between cultures, so consider your audience.
Energy, passion, urgency, and danger. Used for sales and warnings.
Warmth, enthusiasm, and fun. Friendly and attention-grabbing.
Happiness, optimism, and caution. Highly visible.
Nature, growth, health, and money. Calming and fresh.
Trust, calm, and reliability. A favorite for banks and tech brands.
Luxury, creativity, and mystery. Long linked with royalty.
Playfulness, romance, and kindness.
Elegance and power, purity and simplicity, and neutral balance.
Every named color you can use in CSS, grouped by color family, with HEX and RGB codes.
| Color | Name | CSS keyword | HEX | RGB | Family |
|---|---|---|---|---|---|
| Light Coral | lightcoral | #F08080 | rgb(240, 128, 128) | Red | |
| Rosy Brown | rosybrown | #BC8F8F | rgb(188, 143, 143) | Red | |
| Indian Red | indianred | #CD5C5C | rgb(205, 92, 92) | Red | |
| Red | red | #FF0000 | rgb(255, 0, 0) | Red | |
| Firebrick | firebrick | #B22222 | rgb(178, 34, 34) | Red | |
| Brown | brown | #A52A2A | rgb(165, 42, 42) | Red | |
| Dark Red | darkred | #8B0000 | rgb(139, 0, 0) | Red | |
| Maroon | maroon | #800000 | rgb(128, 0, 0) | Red | |
| Salmon | salmon | #FA8072 | rgb(250, 128, 114) | Red | |
| Tomato | tomato | #FF6347 | rgb(255, 99, 71) | Red | |
| Crimson | crimson | #DC143C | rgb(220, 20, 60) | Red | |
| Dark Salmon | darksalmon | #E9967A | rgb(233, 150, 122) | Orange & brown | |
| Coral | coral | #FF7F50 | rgb(255, 127, 80) | Orange & brown | |
| Orange Red | orangered | #FF4500 | rgb(255, 69, 0) | Orange & brown | |
| Light Salmon | lightsalmon | #FFA07A | rgb(255, 160, 122) | Orange & brown | |
| Sienna | sienna | #A0522D | rgb(160, 82, 45) | Orange & brown | |
| Chocolate | chocolate | #D2691E | rgb(210, 105, 30) | Orange & brown | |
| Saddle Brown | saddlebrown | #8B4513 | rgb(139, 69, 19) | Orange & brown | |
| Peach Puff | peachpuff | #FFDAB9 | rgb(255, 218, 185) | Orange & brown | |
| Sandy Brown | sandybrown | #F4A460 | rgb(244, 164, 96) | Orange & brown | |
| Linen | linen | #FAF0E6 | rgb(250, 240, 230) | Orange & brown | |
| Peru | peru | #CD853F | rgb(205, 133, 63) | Orange & brown | |
| Bisque | bisque | #FFE4C4 | rgb(255, 228, 196) | Orange & brown | |
| Dark Orange | darkorange | #FF8C00 | rgb(255, 140, 0) | Orange & brown | |
| Antique White | antiquewhite | #FAEBD7 | rgb(250, 235, 215) | Orange & brown | |
| Burlywood | burlywood | #DEB887 | rgb(222, 184, 135) | Orange & brown | |
| Tan | tan | #D2B48C | rgb(210, 180, 140) | Orange & brown | |
| Blanched Almond | blanchedalmond | #FFEBCD | rgb(255, 235, 205) | Orange & brown | |
| Navajo White | navajowhite | #FFDEAD | rgb(255, 222, 173) | Orange & brown | |
| Papaya Whip | papayawhip | #FFEFD5 | rgb(255, 239, 213) | Orange & brown | |
| Moccasin | moccasin | #FFE4B5 | rgb(255, 228, 181) | Orange & brown | |
| Old Lace | oldlace | #FDF5E6 | rgb(253, 245, 230) | Orange & brown | |
| Wheat | wheat | #F5DEB3 | rgb(245, 222, 179) | Orange & brown | |
| Orange | orange | #FFA500 | rgb(255, 165, 0) | Orange & brown | |
| Goldenrod | goldenrod | #DAA520 | rgb(218, 165, 32) | Yellow | |
| Dark Goldenrod | darkgoldenrod | #B8860B | rgb(184, 134, 11) | Yellow | |
| Cornsilk | cornsilk | #FFF8DC | rgb(255, 248, 220) | Yellow | |
| Gold | gold | #FFD700 | rgb(255, 215, 0) | Yellow | |
| Lemon Chiffon | lemonchiffon | #FFFACD | rgb(255, 250, 205) | Yellow | |
| Khaki | khaki | #F0E68C | rgb(240, 230, 140) | Yellow | |
| Pale Goldenrod | palegoldenrod | #EEE8AA | rgb(238, 232, 170) | Yellow | |
| Dark Khaki | darkkhaki | #BDB76B | rgb(189, 183, 107) | Yellow | |
| Light Yellow | lightyellow | #FFFFE0 | rgb(255, 255, 224) | Yellow | |
| Beige | beige | #F5F5DC | rgb(245, 245, 220) | Yellow | |
| Light Goldenrod Yellow | lightgoldenrodyellow | #FAFAD2 | rgb(250, 250, 210) | Yellow | |
| Yellow | yellow | #FFFF00 | rgb(255, 255, 0) | Yellow | |
| Olive | olive | #808000 | rgb(128, 128, 0) | Yellow | |
| Yellow Green | yellowgreen | #9ACD32 | rgb(154, 205, 50) | Green | |
| Olive Drab | olivedrab | #6B8E23 | rgb(107, 142, 35) | Green | |
| Dark Olive Green | darkolivegreen | #556B2F | rgb(85, 107, 47) | Green | |
| Green Yellow | greenyellow | #ADFF2F | rgb(173, 255, 47) | Green | |
| Chartreuse | chartreuse | #7FFF00 | rgb(127, 255, 0) | Green | |
| Lawn Green | lawngreen | #7CFC00 | rgb(124, 252, 0) | Green | |
| Pale Green | palegreen | #98FB98 | rgb(152, 251, 152) | Green | |
| Light Green | lightgreen | #90EE90 | rgb(144, 238, 144) | Green | |
| Dark Sea Green | darkseagreen | #8FBC8F | rgb(143, 188, 143) | Green | |
| Lime | lime | #00FF00 | rgb(0, 255, 0) | Green | |
| Lime Green | limegreen | #32CD32 | rgb(50, 205, 50) | Green | |
| Forest Green | forestgreen | #228B22 | rgb(34, 139, 34) | Green | |
| Green | green | #008000 | rgb(0, 128, 0) | Green | |
| Dark Green | darkgreen | #006400 | rgb(0, 100, 0) | Green | |
| Sea Green | seagreen | #2E8B57 | rgb(46, 139, 87) | Green | |
| Medium Sea Green | mediumseagreen | #3CB371 | rgb(60, 179, 113) | Green | |
| Spring Green | springgreen | #00FF7F | rgb(0, 255, 127) | Green | |
| Medium Spring Green | mediumspringgreen | #00FA9A | rgb(0, 250, 154) | Teal & cyan | |
| Aquamarine | aquamarine | #7FFFD4 | rgb(127, 255, 212) | Teal & cyan | |
| Medium Aquamarine | mediumaquamarine | #66CDAA | rgb(102, 205, 170) | Teal & cyan | |
| Turquoise | turquoise | #40E0D0 | rgb(64, 224, 208) | Teal & cyan | |
| Light Sea Green | lightseagreen | #20B2AA | rgb(32, 178, 170) | Teal & cyan | |
| Medium Turquoise | mediumturquoise | #48D1CC | rgb(72, 209, 204) | Teal & cyan | |
| Light Cyan | lightcyan | #E0FFFF | rgb(224, 255, 255) | Teal & cyan | |
| Pale Turquoise | paleturquoise | #AFEEEE | rgb(175, 238, 238) | Teal & cyan | |
| Cyan | cyan | #00FFFF | rgb(0, 255, 255) | Teal & cyan | |
| Dark Cyan | darkcyan | #008B8B | rgb(0, 139, 139) | Teal & cyan | |
| Dark Slate Gray | darkslategray | #2F4F4F | rgb(47, 79, 79) | Teal & cyan | |
| Teal | teal | #008080 | rgb(0, 128, 128) | Teal & cyan | |
| Dark Turquoise | darkturquoise | #00CED1 | rgb(0, 206, 209) | Teal & cyan | |
| Cadet Blue | cadetblue | #5F9EA0 | rgb(95, 158, 160) | Teal & cyan | |
| Powder Blue | powderblue | #B0E0E6 | rgb(176, 224, 230) | Teal & cyan | |
| Light Blue | lightblue | #ADD8E6 | rgb(173, 216, 230) | Teal & cyan | |
| Deep Sky Blue | deepskyblue | #00BFFF | rgb(0, 191, 255) | Teal & cyan | |
| Sky Blue | skyblue | #87CEEB | rgb(135, 206, 235) | Blue | |
| Light Sky Blue | lightskyblue | #87CEFA | rgb(135, 206, 250) | Blue | |
| Steel Blue | steelblue | #4682B4 | rgb(70, 130, 180) | Blue | |
| Dodger Blue | dodgerblue | #1E90FF | rgb(30, 144, 255) | Blue | |
| Light Slate Gray | lightslategray | #778899 | rgb(119, 136, 153) | Blue | |
| Slate Gray | slategray | #708090 | rgb(112, 128, 144) | Blue | |
| Light Steel Blue | lightsteelblue | #B0C4DE | rgb(176, 196, 222) | Blue | |
| Cornflower Blue | cornflowerblue | #6495ED | rgb(100, 149, 237) | Blue | |
| Royal Blue | royalblue | #4169E1 | rgb(65, 105, 225) | Blue | |
| Lavender | lavender | #E6E6FA | rgb(230, 230, 250) | Blue | |
| Blue | blue | #0000FF | rgb(0, 0, 255) | Blue | |
| Medium Blue | mediumblue | #0000CD | rgb(0, 0, 205) | Blue | |
| Dark Blue | darkblue | #00008B | rgb(0, 0, 139) | Blue | |
| Midnight Blue | midnightblue | #191970 | rgb(25, 25, 112) | Blue | |
| Navy | navy | #000080 | rgb(0, 0, 128) | Blue | |
| Slate Blue | slateblue | #6A5ACD | rgb(106, 90, 205) | Blue | |
| Dark Slate Blue | darkslateblue | #483D8B | rgb(72, 61, 139) | Blue | |
| Medium Slate Blue | mediumslateblue | #7B68EE | rgb(123, 104, 238) | Blue | |
| Medium Purple | mediumpurple | #9370DB | rgb(147, 112, 219) | Purple & magenta | |
| Rebecca Purple | rebeccapurple | #663399 | rgb(102, 51, 153) | Purple & magenta | |
| Blue Violet | blueviolet | #8A2BE2 | rgb(138, 43, 226) | Purple & magenta | |
| Indigo | indigo | #4B0082 | rgb(75, 0, 130) | Purple & magenta | |
| Dark Orchid | darkorchid | #9932CC | rgb(153, 50, 204) | Purple & magenta | |
| Dark Violet | darkviolet | #9400D3 | rgb(148, 0, 211) | Purple & magenta | |
| Medium Orchid | mediumorchid | #BA55D3 | rgb(186, 85, 211) | Purple & magenta | |
| Thistle | thistle | #D8BFD8 | rgb(216, 191, 216) | Purple & magenta | |
| Plum | plum | #DDA0DD | rgb(221, 160, 221) | Purple & magenta | |
| Violet | violet | #EE82EE | rgb(238, 130, 238) | Purple & magenta | |
| Magenta | magenta | #FF00FF | rgb(255, 0, 255) | Purple & magenta | |
| Dark Magenta | darkmagenta | #8B008B | rgb(139, 0, 139) | Purple & magenta | |
| Purple | purple | #800080 | rgb(128, 0, 128) | Purple & magenta | |
| Misty Rose | mistyrose | #FFE4E1 | rgb(255, 228, 225) | Pink | |
| Orchid | orchid | #DA70D6 | rgb(218, 112, 214) | Pink | |
| Medium Violet Red | mediumvioletred | #C71585 | rgb(199, 21, 133) | Pink | |
| Deep Pink | deeppink | #FF1493 | rgb(255, 20, 147) | Pink | |
| Hot Pink | hotpink | #FF69B4 | rgb(255, 105, 180) | Pink | |
| Pale Violet Red | palevioletred | #DB7093 | rgb(219, 112, 147) | Pink | |
| Pink | pink | #FFC0CB | rgb(255, 192, 203) | Pink | |
| Light Pink | lightpink | #FFB6C1 | rgb(255, 182, 193) | Pink | |
| White | white | #FFFFFF | rgb(255, 255, 255) | Grays & neutrals | |
| Snow | snow | #FFFAFA | rgb(255, 250, 250) | Grays & neutrals | |
| White Smoke | whitesmoke | #F5F5F5 | rgb(245, 245, 245) | Grays & neutrals | |
| Gainsboro | gainsboro | #DCDCDC | rgb(220, 220, 220) | Grays & neutrals | |
| Light Gray | lightgray | #D3D3D3 | rgb(211, 211, 211) | Grays & neutrals | |
| Silver | silver | #C0C0C0 | rgb(192, 192, 192) | Grays & neutrals | |
| Dark Gray | darkgray | #A9A9A9 | rgb(169, 169, 169) | Grays & neutrals | |
| Gray | gray | #808080 | rgb(128, 128, 128) | Grays & neutrals | |
| Dim Gray | dimgray | #696969 | rgb(105, 105, 105) | Grays & neutrals | |
| Black | black | #000000 | rgb(0, 0, 0) | Grays & neutrals | |
| Seashell | seashell | #FFF5EE | rgb(255, 245, 238) | Grays & neutrals | |
| Floral White | floralwhite | #FFFAF0 | rgb(255, 250, 240) | Grays & neutrals | |
| Ivory | ivory | #FFFFF0 | rgb(255, 255, 240) | Grays & neutrals | |
| Honeydew | honeydew | #F0FFF0 | rgb(240, 255, 240) | Grays & neutrals | |
| Mint Cream | mintcream | #F5FFFA | rgb(245, 255, 250) | Grays & neutrals | |
| Azure | azure | #F0FFFF | rgb(240, 255, 255) | Grays & neutrals | |
| Alice Blue | aliceblue | #F0F8FF | rgb(240, 248, 255) | Grays & neutrals | |
| Ghost White | ghostwhite | #F8F8FF | rgb(248, 248, 255) | Grays & neutrals | |
| Lavender Blush | lavenderblush | #FFF0F5 | rgb(255, 240, 245) | Grays & neutrals |
Creative ideas for artists, crafters, and friends.
Generate three colors and make a drawing using only those, plus black and white.
Generate one color each morning and find or photograph it around you.
Build an outfit around a random color you'd never usually wear.
Lock a color you like, generate the rest, and plan a room around the palette.
Generate two or three colors for a new nail design or eye look.
Take turns in the guessing game and compare streaks.
Match the count to your project.
| Colors | Best for |
|---|---|
| 1 color | A color of the day, a drawing prompt, or a quick pick |
| 2–3 colors | Logos, outfits, and simple drawing challenges |
| 4–6 colors | Website, app, and brand palettes |
| 7–24 colors | Data charts, game assets, and big moodboards |
More than a random HEX code.
Every color a standard screen can show, or just the named CSS colors.
HEX, RGB, HSL, and CMYK for every swatch.
The nearest of 139 CSS color names for every color.
WCAG contrast ratios against white and black text.
Keep favorites, sort by hue, and copy CSS variables or JSON.
No sign-up, and nothing is saved or uploaded.
Who uses a random color generator, and why.
Break creative block and explore palettes for UI, branding, and posters.
Grab HEX codes and CSS variables for prototypes and placeholder data.
Drawing challenges and fresh color combinations.
Teach color theory, digital color codes, and accessibility.
Ideas for knitting, nail art, rooms, and parties.
Guess-the-HEX rounds and color challenges.
When to use this tool, and when another color tool fits better.
Want colors that are designed to match? The Color Palette Generator builds harmonious palettes by style and use case.
Already have a color and need to convert it? Use the Color Code Generator.
Have a HEX code and want its name? That tool focuses on naming one color.
Need a smooth blend between colors? Try the Gradient Generator.
What this tool is and is not.
The same HEX code can look different on different screens and settings.
Converted with the standard formula. Ask your printer for exact values.
Names come from the 139 CSS colors; "≈" means close, not exact.
Everything runs in your browser, and nothing is saved.
Key terms for talking about color.
The basic color family, measured in degrees around the color wheel.
How intense or gray a color is.
How close a color is to white or black.
A color mixed with white.
A color mixed with black.
A color mixed with gray.
A six-character code like #FF7F50 that describes a screen color.
The red, green, and blue light that screens mix to make colors.
The cyan, magenta, yellow, and black inks used in printing.
How different two colors' brightness is, from 1:1 to 21:1.
The Web Content Accessibility Guidelines, which set contrast minimums.
The range of colors a screen or printer can reproduce.
Turn random picks into colors you'll actually use.
Pastel and muted styles are easier to combine than any-color mode.
Lock one color you love and regenerate until the rest fit.
Use AA or better for any color behind words.
Pair bright colors with a gray, off-white, or near-black.
Sorting makes it easier to see which colors belong together.
Try colors in a mockup—small swatches can mislead.
Explore more tools in the directory.
Harmonious palettes by style and use case.
Convert HEX, RGB, and HSL color codes.
Find the name of any HEX color.
Linear, radial, and conic CSS gradients.
Gradients with ready-to-copy CSS.
Spin between your favorite colors.