Playfold is an HTML website template for board game cafes that want the first visit to feel easy to plan. Its 27 pages connect the game shelf, cafe menu, hosted evenings and practical visit details, helping couples, families and larger groups find a comfortable starting point. A game finder turns preferences into a shortlist, while contextual links carry the visitor's chosen session, table or game into a complete table-request journey.

The design takes its character from an open game box and a welcoming neighborhood cafe. Soft Fraunces headings, a folded-board mark, wooden-token details and original table photography sit within rich berry and plum gradients with apricot highlights. The homepage combines a social scene and a useful finder, while game profiles, food menus, event pages and arrival guidance each have layouts suited to their content. Berry & Apricot, Grove & Honey, and Twilight & Lilac schemes provide 3 distinct color choices, each with Light, Dark and Auto modes.

Bring the shelf to life

The library combines player count, available time, complexity and mood to help visitors choose a game. Clear facts, object photography and individual profiles explain how each game feels at the table, what a turn involves and how a group can prepare. Visitors can browse the full collection, reset an empty search and shortlist up to 3 games.

Each profile has a purposeful next step. A table request from a game carries that game's identity and a suitable group size, while changes to the number of players remove incompatible choices. The collection is editable through structured game and media records, with authored page layouts for the stories and guidance around each game.

Make room for more than a game

Dedicated food and drink pages give the cafe a substantial presence, with menu sections, prices, dietary guidance and photography. Learn-to-play sessions, open-table evenings, family visits, outings for 2 and group gatherings each have their own useful preparation content and relevant request links.

First-visit guidance explains host help and the opening round. Table comparisons, hours, arrival information, access guidance, expandable questions and the cafe story answer the practical questions that help a visitor decide to come. These pages share Playfold's visual character without repeating the same opening composition throughout.

Carry a plan into a table request

The 3-step request brings together the group, table, occasion, date, time and shortlisted games before collecting contact details and presenting an editable review. Field errors guide visitors back to the relevant step. Pending feedback, completion, unavailable and rejected requests, uncertain-receipt recovery and a details download complete the frontend experience.

The delivered default demonstrates this journey without sending information. A separate documented live mode connects the frontend to a buyer-provided receiving service. A received request remains a request for staff review, rather than a confirmed booking or a game-stock reservation.

What is included

• 27 complete pages: 24 substantive cafe, game, session, visit and request pages, plus Privacy, Accessibility and a custom 404.
• Game discovery and planning: 4 combined finder filters, empty/reset states, a 3-game shortlist, 6 detailed game profiles and contextual table-request links.
• Complete request frontend: 3 steps, validation, review and editing, pending feedback, meaningful outcomes, same-request retry and a text download.
• Ready-made website and editable source: semantic HTML, layered CSS, vanilla JavaScript, shared partials, structured content, readable and minified assets, build commands and tests.
• Original visual assets: 12 illustrative photographic scenes supplied as 36 responsive WebP files, an editable folded-board SVG mark and table and game-turn graphics.
• Local typography: Fraunces and DM Sans WOFF2 fonts with their original license notices.
• Buyer documentation: a responsive HTML guide covering content, appearance, game data, image replacement, request receiving and hosting.

Features

• 3 named palettes with coordinated light and dark surfaces.
• Light, Dark and Auto appearance choices with remembered preferences.
• Close desktop dropdowns with continuous hover entry and keyboard access.
• Compact phone navigation with grouped disclosure rows.
• Player-aware shortlist and table choices.
• Separate demonstration and live request behavior with strict acknowledgment handling.
• Responsive images, local fonts and a custom error page.

Accessibility features

Semantic landmarks, structured headings, a skip link, image alternatives and labeled fields support clear navigation and reading. Keyboard users have visible focus treatments, native disclosures and deliberate focus return. Errors are associated with their fields, and validation reveals an earlier step before moving focus to a field that needs attention.

Responsive layouts preserve reading order, and reduced-motion preferences are respected. The collection and native navigation remain useful when JavaScript is unavailable, with a clear fallback for the request form. The buyer guide includes named code and table regions that can be scrolled with a keyboard.

Make it your cafe

Business identity, cent-based prices, game facts, media filenames, page metadata and appearance values have clear editing locations. Shared header and footer partials keep the site consistent, while individual HTML fragments give each cafe room to describe its own menu, collection, events and approach to hosting.

The ready-made site runs on static hosting. Its self-contained source and documentation let a cafe adapt the complete visitor journey, from finding a first game to preparing a table request, around the way its own team welcomes people.