Random HSLA Color Generator

Choose uniformly from integer HSL tuples plus an 8-bit alpha channel. Uses injected randomness and integer channel values.

Description

Choose one integer HSLA tuple with an 8-bit alpha channel 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. alpha is another integer from 0 through 255: zero is transparent and 255 is opaque. Divide it by 255 for a CSS fractional alpha value. There is no formatted color string in the result.

When to use Random HSLA Color Generator

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

How to use Random HSLA Color Generator and understand its results

Run with no input fields, or send {} programmatically.
Read hue in degrees and saturationPercent and lightnessPercent as percentages, while retaining alpha as an opacity byte.
Format the example as hsl(90 0% 0% / 0), using alpha/255 after the slash. Evaluate the composited color against its actual background.

index = floor(randomDraw × 940124160)

One finite draw in [0, 1) selects among 940,124,160 coordinate tuples.

alpha = index mod 256; q = floor(index/256); lightnessPercent = q mod 101; saturationPercent = floor(q/101) mod 101; hue = floor(q/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,
    "alpha": 0
  }
}

Draw zero gives zero for every field. A draw immediately below one gives hue 359, both percentage coordinates 100, and alpha 255. 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.

The alpha field is not a percentage or a 0–1 fraction. Copying it directly into CSS fractional alpha gives the wrong opacity.

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 HSL Color Generator
Generate HSL without an alpha field.
Random Grayscale Color Generator
Choose one 8-bit neutral level rather than a hue tuple.