Build your Spin-the-Wheel decider with AI in under 5 minutes

Build a spin-the-wheel decision maker with a customisable entry list, weighted slices, raffle mode, and a carnival-marquee aesthetic — entries and history live in browser storage, nothing leaves the page.

So funktioniert es

Schritt 1

Beschreiben Sie Ihre Idee

Schreiben Sie eine Beschreibung in Textform, die erklärt, was Sie möchten.

Schritt 2

Die KI erstellt es

FloopFloop generiert sofort produktionsreifen Code.

Schritt 3

Bereitstellen & live gehen

Ihr Projekt wird innerhalb von Minuten auf einer eigenen Subdomain gehostet.

Warum mit KI statt mit einem Entwickler bauen?

FloopFloopTraditioneller Entwickler
Zeit bis zum LaunchUnter 5 Minuten2–8 Wochen
KostenAb 0 $5.000 $ – 50.000 $+
WartungInklusiveLaufendes Honorar

What is a spin the wheel?

A spin-the-wheel decider is the most universally useful client-side tool that exists — a teacher uses it to call on students at random, a streamer uses it to pick a giveaway winner from chat, a friend group uses it to decide where to eat without anyone feeling personally responsible for the choice, and a marketing team uses it to draw a prize from a sponsored entry pool. The category has settled around a couple of hosted sites (wheelofnames.com, pickerwheel.com, wheeldecide.com) which work fine but all log the entries you type, gate the most useful features (weighted slices, sound effects, custom colours) behind a sign-in, and surround the wheel with ads. None of which is necessary — the actual functionality is a polar-coordinate SVG and a cumulative-sum random pick. Owning the page yourself means you control the look, the entry list never leaves your browser, and you can extend the wheel with whatever your specific use case needs (URL-encoded sharing, CSV import, sound effects, a Tiktok-friendly portrait layout) by asking the AI for one more prompt.

Common features

  • Polar-coordinate SVG wheel with one slice per entry, in entry order
  • Per-entry weight column — bigger weight = bigger slice + higher win chance
  • Eight-colour palette cycled by index so the same list always looks the same
  • Cumulative-sum weighted random pick — winner decided before the spin starts
  • 6–8 full rotations on each spin with cubic-bezier deceleration over ~5.8s
  • Confetti burst spawned imperatively on winner reveal (auto-cleans after 3s)
  • Raffle mode — toggle to remove the winning entry from the wheel after each spin
  • Last-20-spins history list with relative timestamps ('5m ago', '2h ago')
  • localStorage persistence — entries, history, and the raffle toggle survive reloads
  • Single client-component island on a force-static page — CDN-cachable

Real-world examples

Classroom random-name caller

Teacher loads the wheel with the class roster at the start of term. Each lesson the spin replaces 'who wants to answer this?' with a fair random pick. Raffle mode keeps the same student from being called twice in a row; turning it off mid-lesson lets a student be picked again for a follow-up question.

Livestream giveaway picker

Streamer pastes the giveaway entrants (paid sponsors get weighted slices), spins on camera, the winner modal pops with a confetti burst and the streamer's audience sees the result in real time. The running history list doubles as proof that no entry was added between the spin and the announcement.

What-should-we-eat decider

Group of friends loads up their favourite local restaurants, spins to settle the decision, and nobody has to be the person who picked. Save the wheel to localStorage and the next time it's pizza-or-tacos night the same options are still there — no list to retype.

Why FloopFloop fits spin the wheel projects

The reason wheelofnames-style sites exist is that the underlying math is tiny — a slice array, a weighted random pick, a CSS transition. What FloopFloop ships on top of that is the *visual identity*: a carnival marquee with a striped cream backdrop, a marquee bulb border around the wheel that reads like a fairground sign, a chunky red Spin button with the kind of bottom-shadow press effect arcade games used to have, and confetti that drops when a winner lands. Five style variants (classic carnival, Vegas casino, pastel game-show, glitch arcade, birthday rainbow) cover the obvious use cases without making every wheel on the internet look the same. And because the whole tool is client-side, the visual is the only thing differentiating yours from anyone else's — exactly the dimension where AI-generated styling beats every hosted competitor.

Probieren Sie diese Prompts aus

Kopieren Sie einen der folgenden Prompts und fügen Sie ihn in FloopFloop ein, um zu starten.

Build a spin-the-wheel decision maker. Single page: a circular SVG wheel with one slice per entry, a chunky 'Spin!' CTA, an entry editor in a sidebar with weight + colour per row, a 'remove winner after spin' raffle-mode toggle, and a last-20-spins history list. Visual: carnival marquee — cream canvas with diagonal stripe backdrop, marquee bulb border around the wheel, Fredoka display type, big red 'Spin!' button with a bottom-shadow press effect, confetti burst on winner reveal. Everything client-side via localStorage.

Create a wheel-of-names tool for classroom random-caller use. Teacher enters student names, hits Spin, the wheel rotates 6-8 turns over ~5s with realistic deceleration, and a winner modal pops with the chosen name. Toggle to remove the winner after each pick so the same student isn't called twice in a row. Persist the class list in browser storage so the next lesson opens with the same roster.

Build a raffle picker for a livestream giveaway. Streamer pastes one entry per line, optionally with a weight column for paid sponsors. Big spin button with sound-effect-friendly visual feedback, full-screen winner reveal with confetti, and a running history of all winners (so the streamer can screenshot the leaderboard at the end of the stream). Shareable URL that encodes the entry list to a hash so the audience can open the same wheel on their own machine.

Build a decision-spinner with five visual variants — classic carnival (cherry + sunshine), Vegas casino (gold on near-black), pastel game-show (mint + coral), glitch arcade (neon cyan + magenta on midnight), and birthday party (rainbow hot pops). Same wheel + bulb border + chunky CTA across all of them; only the colour palette + canvas background swap so the design holds together.

Häufig gestellte Fragen

How is this different from wheelofnames.com or pickerwheel.com?
Hosted picker sites work but they're ad-supported, log the entries you type, and lock the look behind a sign-in. The version FloopFloop generates is yours — the entry list lives in your browser's localStorage, there's no analytics on the page, and the visual (carnival marquee, vintage casino, neon arcade — pick one) is whatever you ask for. It also ships with weighted slices and raffle-mode (remove-winner-after-spin) out of the box, both of which the free tier of most picker sites paywall.
Is the wheel actually random or does it just look random?
The winner is decided in JavaScript first via Math.random(), then the wheel's final rotation is computed to land that slice under the top pointer. So the spin animation is cosmetic; the result is a fair weighted draw before the wheel starts moving. Weighted entries work — set a weight of 3 on one slice and it gets a 3x bigger slice on the wheel and a 3x higher chance of winning. Spec: the picker uses cumulative-sum over the per-slice weights, so an entry with weight 0 never wins (useful for temporarily disabling a row without deleting it).
Can I share the wheel with someone else?
Out of the box the entries live in your browser's localStorage, so opening the page on a different device starts you with the default entries. Adding a 'copy share URL' button is a one-prompt extension — encode the entry list into a base64 URL hash, the recipient opens the link and their browser hydrates the same wheel. Useful for a teacher posting a 'spin to pick your group' link, or a streamer sharing the raffle wheel so the audience can verify the entries themselves.
Does the raffle mode actually remove the winner from the next spin?
Yes. When 'remove winner after each spin' is on, clicking the 'Remove from wheel' button in the winner modal drops that entry from the live list, the wheel re-renders with one fewer slice, and the next spin runs over the smaller pool. The history list keeps the removed entries so you can still see the full draw order at the end. Turn the toggle off and the wheel behaves like a normal random picker — winners stay on the wheel and can be drawn again.
What's the wheel's animation built on — Canvas? a library?
Plain SVG + a CSS transform transition, no animation library. Each slice is an arc path, the wheel rotates as a single <g> element via a cubic-bezier transition that lasts about 5.8s with realistic deceleration. The browser does the easing in compositor; the JavaScript only sets the final rotation and listens for the transitionend event. That keeps the bundle under ~30kB gzipped (Fredoka + Nunito + the spinner code combined) and works offline once the page is in the browser cache.
Can I use this for a public giveaway or a regulated raffle?
For an informal giveaway — picking a winner among the people who replied to a tweet, choosing a Discord member, deciding who pays for dinner — absolutely. For anything legally regulated (national lotteries, prize promotions with thresholds set by your local consumer-protection law), no client-side picker meets the audit and provable-randomness bar regulators require. For those, the picker FloopFloop generates is fine to *demonstrate* the draw on stream as long as the audit trail itself comes from a regulated provider.

Verwandte Builder

Weitere Kategorien entdecken

Flashcards / Spaced-Repetition App

Build an Anki-style flashcard app with deck management, four-grade spaced-repetition scheduling (Again / Hard / Good / Easy), per-deck due counters, daily review history, and a streak tracker — generated from a single prompt.

QR Code Generator

Build a QR code generator that encodes URLs, plain text, WiFi networks, or contact cards (vCard) entirely in the browser — with a CRT-terminal aesthetic, customisable colour and error-correction level, and PNG + SVG download.

Wedding Website

Build a single-page wedding site with a live countdown, ceremony + reception details, photo gallery, and a working RSVP form that captures guest replies — generated from a single prompt.

Event Planner

Build an event planning platform with event pages, RSVP management, schedules, and attendee tracking — all generated by AI.

URL Shortener API

Build a Bitly-style URL shortener with a JSON POST /shorten endpoint, custom aliases, optional expiry dates, click counters, and a redirect handler — generated from a single prompt.

Link-in-Bio Page

Build a Linktree-style link-in-bio page with a custom profile, ordered link list, click tracking, and an admin panel to edit links — generated from a single prompt.

Bereit zum Bauen?

Starten Sie jetzt mit Ihrem Projekt – ganz ohne Programmierkenntnisse.

Generate this for me

Jetzt starten