Playable: product configurator Animated HTML website template

The sample page

Kerbcut. Skate shop and workshop, Woodstock, Cape Town.

The idea

The workshop’s concrete wall becomes the configurator: the deck hangs big, turns in 2.5D, and every part you pick on the workshop sheet snaps in with a bounce while the price in rand updates live.

What to try

Pick width, graphic, grip, trucks, wheels and extras on the workshop sheet, drag the deck to flip it, press “Test it: one ollie,” and download your design as a PNG.

Made for

Skate, bike, fashion, furniture, jewelry and any customizable product

Palette

• #C9C4BA
• #191816
• #F4EFE4
• #EAD9A3
• #FF6A1A
• #1E6F86

Typefaces

Bricolage Grotesque + Permanent Marker

Cultural notes

• Original graphics, names and parts: no real deck, wheel, truck or grip brands.
• Total price and the full catalog stay visible without JavaScript; nothing is charged on the page.
• Everything works by keyboard and touch, and with reduced motion the ollie shows as a still image.

The HTML

What you download

• A single index.html file with nothing to install: open it, swap in your brand and copy, and upload it to your hosting.
• In English and Spanish, tested on desktop and mobile.
• Instructions for changing copy, colors, language and prices, plus its license.