A customizable trivia hosting application for bars, events, and game nights.
- Fully Customizable Branding - Set your venue name, colors, host info, and prizes
- Question Packs - Load questions from JSON files, easy to create and share
- Team Management - Track teams and scores throughout the night
- Presentation Mode - Full-screen display for projectors/TVs
- Round System - Multiple rounds with difficulty levels and double points
- Score Tracking - Quick-score bar for fast point updates
- Points Multiplier - Configure points per question and double-points multiplier in Settings
- Import/Export - Save and restore game state
- Leaderboard - Live standings with celebration animations
- Team mode (coming soon) - Give your participants a URL so they can answer right on their phones
# Install dependencies
npm install
# Start development server
npm run dev
# Open http://localhost:3000Edit trivia.config.ts to customize your trivia night:
const config: TriviaConfig = {
name: "yourbar", // Main title
subtitle: "TRIVIA NIGHT", // Subtitle
host: {
name: "Your Name",
social: "Your @handle on LinkedIn",
tagline: "Your tagline here",
},
colors: {
primary: "#d4af37", // Main accent color
secondary: "#722f37", // Secondary color
background: "#09090b", // Background
surface: "#18181f", // Card backgrounds
text: "#f0f0f5", // Text color
textMuted: "#808090", // Muted text
},
prizes: [
{ place: "1st Place", reward: "$84 in OpenAI credits" },
{ place: "2nd Place", reward: "Set of steak knives" },
// ...
],
meta: {
title: "Your Trivia Night",
description: "Description for SEO/AEO/whatever",
},
storagePrefix: "trivia", // localStorage key prefix
};Questions are loaded from JSON files in the questions/ directory.
There's some AI-generated questions to get you started.
If you're a real host, write your own.
Create a JSON file in questions/:
{
"name": "My Trivia Pack",
"description": "Description of the pack",
"author": "Your Name",
"rounds": [
{
"number": 1,
"title": "Round Title",
"category": "Category",
"doublePoints": false,
"questions": {
"easy": [
{ "q": "Question?", "a": "Answer" }
],
"medium": [...],
"hard": [...]
}
}
]
}Edit lib/db/seed-data.ts and change DEFAULT_PACK:
const DEFAULT_PACK = 'your-pack.json';Then delete trivia.db and restart the server to load the new questions.
In the Settings tab, you can configure:
- Points per question - Base points awarded for each correct answer (default: 1)
- Double multiplier - Multiplier applied during double-points rounds (default: 2)
When a round is marked as "double points" in your question pack, the multiplier is automatically applied to all scoring in that round.
- Setup Teams - Add teams in the Teams tab
- Configure Rounds - Select questions for each round
- Lock Rounds - Lock rounds when you're ready to play
- Present - Click "Present" to show questions full-screen
- Score - Use the quick-score bar or Teams tab to award points
- Celebrate - Hit the celebrate button when the winner is crowned!
Arrow Right/Down- Next questionArrow Left/Up- Previous questionSpace/Enter- Toggle answer visibilityEscape- Exit presentation
├── app/ # Next.js app router
│ ├── api/questions/ # API routes
│ ├── layout.tsx # Root layout
│ └── page.tsx # Main page
├── components/ # React components
├── hooks/ # Custom React hooks
├── lib/
│ └── db/ # Database layer
├── questions/ # Question pack JSON files
├── trivia.config.ts # Branding configuration
└── trivia.db # SQLite database (created on first run)
- Framework: Next.js 16 (App Router)
- UI: React 19, Tailwind CSS 4, Radix UI
- Database: SQLite (better-sqlite3)
- Icons: Lucide React
We take security seriously here. Please disclose any vulns to ted@cased.com. Bounties given for best team name.
Contributions are actually very welcome. Feel free to sic your agents on this. Just prompt them with: "Don't generate slop and waste Ted's time" and we're all good.
MIT