Dice Roller

What It Does

The Dice Roller simulates 1 to 4 standard six-sided dice (d6) with true 3D CSS animation. Each die shows pip-accurate faces, rolls to a cryptographically random result, and adds to a running history and session statistics. Built for tabletop game sessions, probability experiments, and anyone who needs a fair, verifiable random roll without hunting for physical dice.

The randomness source is crypto.getRandomValues() — the same entropy pool used for cryptographic key generation — which gives uniform 1–6 distribution with no modulo bias.

How to Use It

1. Select the number of dice (1–4) using the count selector.
2. Click Roll to roll all selected dice simultaneously with a 3D animation.
3. The total updates immediately below the dice. Individual die values are shown on each face.
4. The roll history shows up to the last 40 rolls with individual values and sum.
5. The session stats panel tracks total rolls, running average total, and the best (highest) total of the session.

The Math / How It Works

Randomness: each die value is generated by calling crypto.getRandomValues(new Uint32Array(1)), extracting a 32-bit integer, and mapping it to 1–6 via modulo with bias-rejection (discarding values that would make modulo non-uniform). This ensures a perfectly flat distribution across all six faces.

Probability distributions:

• 1 die (d6): uniform distribution — each value (1–6) has exactly 1/6 probability (~16.7%).
• 2 dice (2d6): triangular distribution — sums from 2–12 with 7 most likely (6/36 = 16.7%), 2 and 12 least likely (1/36 = 2.8%). This is why “7” feels like it comes up constantly in games that use 2d6 — it’s not an illusion.
• 3 dice (3d6): approximately normal distribution by the Central Limit Theorem. Sums 3–18 with the 10–11 range most likely. Used in D&D character stat generation.
• 4 dice (4d6): more concentrated normal distribution around the mean of 14.

As you add more dice, the distribution of sums becomes more bell-shaped (Central Limit Theorem) — extreme values become rarer, middle values become more likely. This is the statistical reason RPG systems use multiple dice for “smoother” randomness and single dice for “anything can happen.”

Die face arrangement: opposite faces on a standard die sum to 7 (1–6, 2–5, 3–4). The 3D CSS cube preserves this convention — the rendering isn’t just cosmetic, it’s geometrically correct.

Why TTRPGs and Games Need This

Tabletop RPG systems use specific dice combinations to control probability distributions deliberately. Understanding the math behind common systems reveals why they feel the way they do:

D&D 5e uses a d20 for most checks — a flat distribution where every value from 1–20 is equally likely. This creates swingy outcomes where a trained expert can still critically fail and a novice can succeed. Advantage (roll 2d20, keep highest) shifts the effective distribution toward higher values without changing the maximum.

Powered by the Apocalypse (PBTA) games roll 2d6 and compare to thresholds: 10+ is a strong hit, 7–9 is a partial hit, 6- is a miss. Because 2d6 is triangular with 7 as the mode, partial hits (7–9) are the most likely single-band outcome — by design. The system creates a world where “sort of succeeds with complications” is the modal experience, not a fallback.

4d6 drop lowest (for D&D stat generation): roll 4d6, discard the lowest die, sum the remaining three. This produces a distribution that skews higher than 3d6, creating characters who are better than average without being superhuman. The drop-lowest mechanic is what makes this feel “heroic.”

Even for casual games — board games, betting games, drinking games — having a cryptographically fair die roll matters more than people think. Physical dice have manufacturing tolerances; some faces are microscopically heavier. crypto.getRandomValues() has neither bias.

Tips & Power Use

• Roll 3 dice repeatedly and track the distribution — you’ll see 10–11 come up most often over a long session. This is the Central Limit Theorem made tangible.
• For D&D advantage: roll 2 dice, record both values, keep the higher. The roller doesn’t do this automatically, but rolling and reading individually gives you the same result.
• Session stats track your best roll. In a long gaming session, watching the “best total” counter is a surprisingly motivating indicator of when luck was on your side.
• For probability experiments: roll a single die 100 times and watch the running average converge toward 3.5 (the expected value of a d6). Each face should appear approximately 16–17 times. If the distribution is significantly off after 100 rolls, re-run — that variance is normal and expected.
• The Coin Flipper is complementary for 50/50 decisions; the dice roller is for decisions with more outcomes or for gaming.

How it works

Each die uses CSS transform-style: preserve-3d to render a true six-face cube. Pips are laid out on a 3×3 grid per standard die convention. The front face always shows the rolled value; the remaining faces are arranged following standard die adjacency (opposite faces sum to 7).

Randomness

Values are generated with crypto.getRandomValues() — the same cryptographic RNG used in security-sensitive contexts — giving uniform 1–6 distribution with no modulo bias corrections needed at this scale.

Stats

The session tracks total rolls, running average total, and the best (highest) total rolled. History shows up to the last 40 rolls with individual die values and sum.