Respawn

Best for

• Gaming cafés, LAN centres and esports clubs. It's written to the National Classification Scheme's ratings, the MA 15+ and R 18+ restrictions, the 2024 rules on loot boxes and simulated gambling, and skill-based prizes (see "Gaming: what we build in").
• Anyone who books stations, lanes or seats by the hour:
  • bowling alleys and entertainment centres (Strike Lanes: a lane map with off-peak prices, and a league bracket)
  • coworking spaces (Desk Club: desks, call pods and meeting rooms on a floor map)
  • escape rooms, karting, music rehearsal rooms, school and club competitions
• Audiences: groups of friends, parents booking for kids, teams entering tournaments, and adults who want the R 18+ night.

Less suited to: a game studio or publisher (Console or Reel), a sports club (Pennant), or anything that sells gambling.

Personality and voice

Loud and fair, the venue that tells parents straight which games suit their kids.

• Headlines: "Press start together." · "What can they play?" · "Bring a team. Win by playing."
• Buttons: "Book stations" · "Hold these" · "Enter"
• Microcopy:
  • "Under 15: MA 15+ games need a parent or adult guardian with them, and R 18+ games aren't available."
  • "3 PCs × 2 hours · Off-peak, before 4 pm on weekdays · Saving $18"
  • "Prizes are won by play, not drawn by chance."
• Words to avoid: "win big", "jackpot", "mystery prize", "pro gamers only", invented player counts or rankings, and anything that dresses a draw up as a tournament.

Colour

Measured contrast (WCAG).

• Lights on:
  • ink on paper 17.2:1
  • muted on paper 6.2:1 (5.6:1 on well)
  • neon on paper 6.7:1 (6.0:1 on well and its soft fill), white on neon 7.3:1
  • ink on cyan 12.5:1; cyan ink 6.7:1 (6.6:1 on its soft fill)
  • ok 6.5:1, alert 6.5:1
• Lights off:
  • ink 17.1:1
  • muted 7.6:1 (6.9:1 on card)
  • neon 8.2:1 (7.5:1 on card), text on neon 7.9:1, neon on its soft fill 7.2:1
  • cyan 13.0:1 (10.0:1 on its soft fill)
  • ok 10.1:1, alert 8.7:1
• Closing card: text 16.6:1, body 11.9:1, cyan em 12.5:1, ink on its cyan button 12.5:1.
• Example dials: red (Strike Lanes, white on red 6.7:1), blue (Desk Club, 6.0:1) and arcade violet (Save Point, 7.8:1) all meet AA, light and dark, and so does each closing card.

Typography

• Display: Chakra Petch, 500–700. Headlines in capitals, station types, game titles, scores. Squared-off corners, like type on a HUD.
• Body: Asap, 400–700. Reading, forms, buttons.
• Mono: Kode Mono, 400–600. Times, prices, ratings, seat numbers.

The signature move: the lit words glitch in. They tear into slices, settle in neon with a cyan ghost beside them, and twitch now and then like a screen.

Layout

• Frame: a 1200px wrap with a max(20px, 4vw) gutter. An ink top line with a cyan label; a sticky header with the d-pad mark; a grid floor behind the hero that rolls towards you.
• Hero: copy on the left; the station booker on the right.
• Then: the game library full width; the tournament board beside the prize and age rules; the bracket; questions; and a dark closing card with scanlines and a pixel ship that hovers.

Shape

• Sharp: --r-s 4px, --r-m 8px, --r-l 14px.
• Pixels: the mark, the tag's plus, the cover art, the trophy and the ship are drawn in CSS, and a blinking cursor sits in each page head. No images needed.

Motion language

• Glitch: the lit words tear in and twitch every few seconds.
• Booker: seats lift on hover, the total steps in when it changes, and the grid floor rolls.
• Elsewhere: the page-head cursor blinks, the bracket's trophy jumps when a champion is crowned, the closing ship hovers, and sections reveal with a rise.
• Motion switch in the footer ([data-motion-toggle], html.calm, remembered as site-motion, with the default from prefers-reduced-motion). Calm stops the glitch, the floor, the cursor, the trophy and the ship.
• Lights off switch ([data-theme-toggle]), remembered as site-theme; theme-color follows.

Imagery and illustration

Your own room, your own stations and your own events, with players' permission. The template draws cover art as pixel tiles in each game's colour, so no box art is borrowed. Use publishers' artwork only as their terms allow, never the official classification marks as decoration, and no stock "gamer with RGB headset".

Signature components

• Station booker: .stations[data-stations] with script[data-st-data] (types as {id, name, short, shortPl, peak, off, count}, taken by type, offPeakBefore, house age, days, noun, ages, holdNote), containing input[data-st-type] radios, [data-st-days], select[data-st-start], input[data-st-hours], input[data-st-players], input[data-st-age], [data-st-map], [data-st-lines], [data-st-total], [data-st-age-out], [data-st-hold] and [data-st-msg].
• Game library: .games[data-games] (add data-follow to take the age from the booker), containing input[data-gm-q], a [data-gm-platform] segmented control, input[data-gm-age], input[data-gm-only], [data-gm-count], .gm-none, and .game cards (data-rating as G, PG, M, MA15 or R18, data-platforms) with .rate, .loot and [data-verdict].
• Bracket: .bracket[data-bracket] with script[data-br-data] (teams as [name, note], a power of two; rounds; results as [round, match, team]; prize), containing [data-br-cols], [data-br-live] and [data-br-reset].
• Tournament board: .tourneys[data-tourneys] with .tn cards (data-rating, data-spots) containing [data-tn-spots], a form with team and age, and [data-tn-msg].
• Supporting pieces: .rate (a rating chip in text), .plan-pair, .card, .facts (--n columns, or .stack), .notice, .side-box, .checks, .faq, .close-card (--close-bg, --close-em).

Multi-page kit

• Phone menu: .menu-btn[aria-controls] opens .site-menu. Escape, an outside click or choosing a link closes it, and Tab stays inside while it's open.
• Current page: aria-current="page", shown as a soft pill.
• Inner pages: .page-head (a grid floor and a blinking cursor), .crumbs, a .tag and a smaller .h1.
• Fields: .field, .fields, .field-wide, fieldset.field-set, .check, .form-card, [aria-invalid="true"]; form[data-template].
• Tiles, segmented control, gate, slider, switch, tables: .choices, .seg, [data-gate], input.range, .switch[role=switch], .table.
• Events: stations (type, count, hours, total, age, date, start), games (shown, playable, age), bracket (champion), tourney (team, left).
• Helper: Respawn.refresh(root), and Respawn.last, the latest detail of each event, for scripts that load afterwards.

Gaming: what we build in

We checked these for Australian gaming venues in October 2026:

• Ratings. G, PG and M are advisory. MA 15+ is legally restricted to people 15 and over, so under-15s need a parent or adult guardian with them; R 18+ is adults only, and proof of age may be asked for. The booker and library apply exactly that, with M marked "not recommended under 15, but allowed".
• Loot boxes and simulated gambling. Since September 2024, games with loot boxes or other paid chance items are rated at least M, and games with simulated gambling at least R 18+. The library labels games with paid random items, and the template's house accounts have spending turned off.
• Prizes. Tournaments are won by play, with entry fees and prizes stated before anyone enters; nothing is drawn by chance, which keeps them clear of the permits states require for trade promotion lotteries. Check your state's rules before running any draw.
• Kids. Under-12s need an adult on site (a house rule you can change), and kids' parties use only games rated for the youngest guest.
• Prices. Every price includes GST and is shown before booking, with off-peak rates stated, and no card surcharges, which end for eftpos, Mastercard and Visa on 1 October 2026.

These notes are design guidance, not legal advice.

• What are the ratings? (Australian Classification)
• New mandatory minimum classifications for gambling-like content (Australian Classification)
• Card surcharging to end on 1 October 2026 (RBA)

Do and don't

• Do show every game's rating, and what it means for this group.
• Do state prizes and entry fees before anyone enters.
• Do price stations in full, with off-peak rates spelled out.
• Don't run prize draws through a tournament page.
• Don't use the official classification marks as decoration; show ratings as text.
• Don't put text on cyan in anything but ink.

Accessibility

• AA contrast throughout (measured above), a skip link and a 3px focus ring.
• Booker: station types are radios; days and seats are buttons with aria-pressed and spoken labels ("PC 7, taken"); taken seats are disabled; the total and the age advice are announced.
• Library: the count and each game's verdict are text, in words, not only colour; ratings are text chips.
• Bracket: matches are labelled groups, teams are buttons with aria-pressed, the champion is announced, and the bracket scrolls on its own on phones.
• Board: each entry form is labelled, and errors and confirmations are announced.
• Testing: responsive to 360px, and tested with motion on and off, in Lights on and Lights off.

How to make it yours