Random Color Generator

Generate random HEX, RGB and HSL colors with live swatches.

0 colors

Random Color Generator

Generate random colors with a live preview of every swatch. Pick how many colors you need, the output format and a style, and the tool fills the list with HEX, RGB or HSL codes ready to paste into CSS, Figma, Photoshop or your code. Press Generate for a new set at any time.

Color styles

  • Any color – the full 24-bit RGB space, perfect for surprising combinations and test data.
  • Pastel – soft, light colors with medium saturation, popular for backgrounds and illustrations.
  • Vivid – highly saturated mid-lightness colors for charts, buttons and highlights.
  • Dark and Light – deep shades for dark themes or very light tints for cards and sections.
  • Grayscale – neutral grays from near-black to near-white.

Formats for every workflow

Choose HEX (optionally uppercase), rgb() or hsl(). The swatch grid below the list shows exactly how each code renders in the browser, so you can spot your favourites before copying.

Uses for random colors

Designers use random colors to break creative blocks and explore palettes quickly. Developers generate them for avatar backgrounds, tag and label colors, chart series, placeholder images and UI tests. Teachers and students use them in art exercises and color-theory lessons, and game makers for team colors and procedural content.

Secure and offline

Colors are created in your browser with the Web Crypto API; nothing is sent to a server. Turn on No duplicate colors to make sure each code in the list is different.

To convert a color you like into other formats, try the HEX to RGBA converter, or create a full CSS background with the CSS Background Color Generator.

Frequently Asked Questions

With 'Any color' each red, green and blue channel is a secure random value from 0 to 255, so all 16,777,216 colors are equally likely. The other styles pick a random hue and keep saturation and lightness inside a range, which gives consistent pastel, vivid, dark, light or gray tones.

HEX is the most common format for CSS and design tools. rgb() is easy to read and to add transparency to later, and hsl() is convenient when you want to tweak lightness or saturation by hand. All three are valid CSS.

Yes. Use the 'Pastel palette' or 'Vivid palette' presets for five harmonious colors, press Generate until you like the set, then copy the codes or download them as a text file.

Random colors are not checked for contrast. Light and pastel styles work well as backgrounds with dark text, dark styles with light text; verify important combinations with a contrast checker.