Random HSL Color Generator

Choose uniformly from integer HSL tuples with hue 0–359 degrees and saturation/lightness 0–100 percent. Uses injected randomness and integer channel values.

Description

Choose one integer HSL tuple from a fixed coordinate grid.

HSL describes sRGB colors through hue, saturation, and lightness; opacity is a separate coordinate when present.^[1]

This generator returns hue from 0 through 359 degrees, saturationPercent from 0 through 100, and lightnessPercent from 0 through 100, all as integers. There is no formatted color string in the result.

When to use Random HSL Color Generator

Use it for HSL coordinate fixtures or color exploration where a discrete integer grid is intended.

How to use Random HSL Color Generator and understand its results

Run with no input fields, or send {} programmatically.
Read hue in degrees and saturationPercent and lightnessPercent as percentages.
Format the example as hsl(90 0% 0%) and check the color in the intended context.

index = floor(randomDraw × 3672360)

One finite draw in [0, 1) selects among 3,672,360 coordinate tuples.

last coordinate = index mod 101; saturationPercent = floor(index/101) mod 101; hue = floor(index/10201)

Mixed-radix decomposition recovers the integer coordinates, with the last coordinate changing fastest.

Uniform randomness gives equal index weight to every tuple. Different tuples can describe the same visible color, so this is not a uniform distribution over perceived colors.

json

{
  "input": {},
  "randomDraw": 0.25,
  "output": {
    "hue": 90,
    "saturationPercent": 0,
    "lightnessPercent": 0
  }
}

Draw zero gives zero for every field. A draw immediately below one gives hue 359, both percentage coordinates 100. Invalid draws fail. Lightness zero gives black and lightness 100 gives white; saturation zero makes hue irrelevant.

Limitations and assumptions

The default source is Math.random; no seed input or cryptographic entropy guarantee is provided. Repeated runs may select the same result, and the distribution depends on the random source.

There are no harmony, contrast, color-vision, alpha-compositing, or perceptual-uniformity guarantees.

Alternative or Complementary methods

Use the related HSL generator when you need a different opacity convention. A grayscale generator samples only neutral byte levels.

References

CSS Color Module Level 4 — World Wide Web Consortium

Similar or alternative tools

Random HSLA Color Generator
Generate HSL with a separate 8-bit opacity field.
Random Grayscale Color Generator
Choose one 8-bit neutral level rather than a hue tuple.