Quorum
A conference site template.
A complete website for a two-day conference, built with Astro 5, TypeScript and plain CSS, with one three.js moment: the hero's hall of seats lights up as the countdown to the doors runs down. Sample content is a fictional event, Quorum 2027 in Rotterdam, so you see every page at real density before you put your own in.
- For
- Conference / event
- Built with
- Astro 5, TypeScript, plain CSS, three.js
- Pages
- 10 designed pages
- Themes
- Light and dark, following the system, with a switch
Draft listing: this template is finished but still in review before it goes on sale.
Screens from the template
Every page is laid out for a 390 pixel phone as well as for tablet and desktop.
More pages
The 3D moment
A hall of perforated seat rings around a stage whose seats light in the accent as the countdown to the doors runs down.
What you get
Straight from the template's README, the same file you will find in the repository.
- Ten page types, all generated from typed data: home, schedule, speakers, a page per speaker, a page per talk, tickets, venue and travel, sponsors, code of conduct and 404.
- A real schedule: day tabs, track and format filters, a switch between event time and the reader's own time zone, a sticky time rail, an "on now" marker and "jump to now" while the event runs, an empty state when filters match nothing, and the state kept in the URL for sharing. Fully keyboard and screen reader friendly; without JavaScript it shows both days in full.
- Calendar files for everything: every session has an
.icsdownload, and the whole programme is one file at/schedule.ics. Generated at build time, times written in UTC so they land correctly in any calendar. - The signature hero: five perforated rings, like a ticket's tear line, around a flat stage disc with an accent rim. Every dot is a seat. On load the hall fills to today's level; on the day, every seat is lit. Lazy loaded, paused off screen and in background tabs, pixel ratio capped at 2, still under reduced motion, and a matching SVG drawing underneath for when WebGL is missing or script is off.
- A live countdown that becomes "happening now" during the event and a thank-you afterwards.
- Light and dark themes that follow the system, with a switch that remembers the choice. The hero follows the switch (pale ground with ink seats, or the night version); the footer stays dark in both.
- Ticket tiers shaped like tickets, with on sale, few left, sold out and coming soon states, a side-by-side comparison table and a worked group-discount example.
- A newsletter form with validation, sending, sent and failed states, and a demo mode until you connect your email service.
- Accessible and fast: semantic HTML, a skip link, visible focus everywhere, AA contrast in both themes, 44 px touch targets, one self-hosted variable font, no trackers, no runtime CDN, no layout shift from images or the 3D scene.
- Responsive from 320 px to wide desktop, designed at 390, 768 and 1440.
Pages and stack
Every page below is designed and built, in both themes, at phone, tablet and desktop sizes.
Pages
- Home
- Schedule
- Speakers
- Speaker
- Talk
- Tickets
- Venue and travel
- Sponsors
- Code of conduct
- 404
Stack
- Astro 5
- TypeScript
- plain CSS
- three.js
The licence, in short
One purchase covers every site you build. Read the whole licence
You can
- Build as many websites and web apps with it as you like, for yourself or for clients.
- Change anything: code, design, copy, colours and layout.
- Charge clients for the work and hand them the finished site with its source code.
You cannot
- Sell, give away or publish the template itself, changed or not, as a template, theme, starter, kit or design file.
- Use it in a product whose main purpose is letting others build sites, like a site builder or theme marketplace.