Spin a virtual roulette wheel
Pick European (single zero) or American (single and double zero). Spin animates, the last ten results stick, and totals tally per colour.
Press Spin to record results — last 10 stick here.
How a roulette spin works
European wheels have 37 pockets (0–36), American wheels add a double zero for 38. The pocket colour follows the canonical layout.
- 01
Choose a wheel
European has a single zero; American adds a double zero.
Inputs are treated as UTF-8 throughout the pipeline and validated client-side as you type — nothing dispatches until the value is well-formed.
wheelinpututf-8client-sidevalidatedwheel · texteuropean · set37 pockets
loaded · parsedclient-side - 02
Press Spin
The pocket animation runs for 900 ms before the result freezes.
Each toggle re-computes through a memoised hook, so flipping options never resets your input and the UI stays snappy on large inputs.
spinoptionslivememoisedtogglesanim · memoised0.9s · live…
options set · memoisedlive - 03
Read the result
Number and colour show in the centre and on the badge row below.
Randomness — where used — comes from
crypto.getRandomValues, neverMath.random. Heavy work sits inuseMemo.resultcomputeinstantlocaldeterministicwin · instant17 black · computed17 black
computed · instantinstant - 04
Copy history
The last 10 spins stay in view — copy them as text.
Copy writes through
navigator.clipboardand downloads use aBlob— zero network traffic. Same input plus same options always yield the same bytes.copydownloadzero-networkreproducibleok · copiedtxt · copiedCopied
shipped · ready to shipsuccess
Pro tips for everyday utilities
Reach for crypto.getRandomValues
Cryptographically random for IDs, tokens, salts. Math.random is for animation and games, not security.
Mock data with seeds
Faker-style libraries can be seeded so tests are reproducible. Embed the seed in the fixture file.
Reference cards beat memory
Cheatsheets for Vim, Git, Docker, Linux signals are faster than man pages when you’re mid-flow.
Browser APIs vary
Touch events, gamepads, and clipboard differ across vendors. Feature-detect before use.
Persist in the right place
localStorage for user preferences, sessionStorage for transient state, IndexedDB for structured data.
When to spin the wheel
Game design, demonstrations, probability classes.
Game prototyping
Test wheel layouts and odds during early design. Random values come from crypto.getRandomValues — cryptographically secure for tokens, salts, and session IDs. Math.random is deterministic enough for animations but predictable enough to be a security bug.
CSPRNG-backedCasino math classes
Show why the house always wins with live spins. Pair with hashids, ULID, or UUID v7 when you need both random and sortable — useful for primary keys, public-facing IDs, and event log ordering without a sequence column.
reproducibleStreamer minigame
Spin live for chat-based decisions. Output is deterministic given the same seed, so fixtures and tests stay reproducible across CI runs and contributor machines. Embed the seed in the fixture file for full replay.
snappyProbability demos
Verify red/black ratios over many spins. Heavy work runs through useMemo so the UI stays snappy on large inputs. Same input + same options yields identical bytes — the kind of stability snapshot tests rely on.
feature-detectedSleep aid
A purely random no-stakes ritual. Storage tools persist to the right backend: localStorage for user preferences, sessionStorage for transient state, IndexedDB for structured data. Pick the right shelf and quota worries disappear.
deterministicDecision shaker
Use a colour to pick a path when stuck. Browser feature detection: clipboard, fullscreen, gamepad, and Web Bluetooth APIs gracefully fall back when unavailable. No surprise white screens on Safari or older Firefox.
production-readyFrequently asked questions
Something missing?
Tell us what you need. We ship the top requests every two weeks.