Steampunk Animated HTML website template

The sample page

Hodinářství U Kyvadla. Watch repair and automata, Vinohrady, Prague.

The idea

A pocket-watch movement lies open on the watchmaker’s bench, and its gear train, with nickel-silver bridges and rubies, shows the real time in Prague.

What to try

Move the cursor to sweep the lamp across the movement and drag any wheel to push the whole train; the arrow keys move the hands forward or back, and they drift back to Prague time on their own.

Made for

Watchmakers, bars, board games and events

Palette

• #4B2E1E
• #B8893B
• #A4532F
• #2C4740
• #E9D9B6
• #2E2B28

Typefaces

IM Fell English + Special Elite

Cultural notes

• Gears that truly mesh: real tooth ratios (8 × 7.5 × 10) and an escapement beating 18,000 times an hour.
• No famous characters or works, no watch brands and nothing from Prague’s astronomical clock; the house name is invented.
• All text sits on flat paper or plates with AA contrast.

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.