LiveSpin the wheels or use the arrow keys to pick a slot
The prompt
Build a booking card for a fictional rehearsal studio, Lowfold Rooms, on a near black page (#101014) with a soft amber glow. Left column: an amber uppercase label with a pulsing red dot (#ff4b3e), the headline "Rehearse loud. Book by the hour." with the second sentence in grey, one line of copy and four chips (24 square metres, Five piece kit, Two 100W amps, PA and four mics). Right column: a 500px card (#1c1c23, 28px radius) with three drum wheels side by side for Day (14 days from Mon 16 Nov), Start (10am to 11pm) and Length (1 to 6 hours). Rows are 48px; each item sits on a 3D cylinder using translateZ(minus R) rotateX(angle) translateZ(R) at 20 degrees per row, fading with distance. An amber band marks the centre row and gradients fade the top and bottom. Drag with momentum and a snap, scroll with the mouse wheel, tap a row to jump to it, and use arrow keys, Page Up, Page Down, Home and End on each wheel (role spinbutton with aria-valuetext). Some starts are struck through as booked. Show the slot, a price at £18 an hour or £22 at weekends, a warning when booked, and pull the length back so the room still closes at midnight. An amber "Hold this slot" button toggles a held state. Stack on phones and snap without easing for reduced motion.
Written by Informeek Studio to recreate this design. Prompts are not deterministic: running it again gives a similar result, not an identical one.
Use it in three steps
Copy the prompt with the button above.
Paste it into your tool, such as v0, Lovable, Bolt or Claude.
Make it yours by changing the three wheels to your own days, times and lengths.
About this time picker ui
Typing a time into a box is fiddly on a phone, which is why so many apps use spinning wheels. This time picker ui puts three of them side by side on a booking card for a rehearsal room, one each for the day, the start time and how long you want the room. Each wheel is drawn as a real cylinder, so rows tilt away and fade as they leave the amber band in the middle.
It behaves like the wheels people already know. Flick a wheel and it keeps spinning before settling on a row, or tap a row above or below to jump to it. The mouse wheel and the keyboard work too. The card checks the choice as it changes, so booked hours are struck through, a warning appears when your slot overlaps one, and the length shortens itself if you would run past midnight.
Why the prompt works
It gives the cylinder maths in one transform, so the wheels look round, not flat.
It lists every input, drag, wheel, tap and keys, with the right ARIA role.
It adds real booking rules, taken slots, weekend prices and a closing time.
It sets the row height, which decides how the wheels feel under a thumb.
Where to use it
Studio, court and desk booking, restaurant tables, delivery slots and any form where people choose a time from a short list.
The prompt is shared under CC BY 4.0. Reuse it freely, including commercially, with a credit linking back to this page.
We use cookies to measure how the site is used and, if you allow it, to show advertising. Prompts you copy and previews you try are never collected. See our privacy policy.
