How to Build a Custom TTRPG Companion for Vampire: The Masquerade
While I am super new to the tabletop RPG world — whether it’s Dungeons & Dragons, Pathfinder, Call of Cthulhu, or something deeper in the World of Darkness — I always felt that the digital side of these games was missing something. If you’re looking for a dungeons and dragons app or any kind of TTRPG companion app that actually keeps up with a modern game night, you already know the problem. You’ve got character sheets printed on paper, a wonky dice roller that just displays numbers, and rules buried in a 400-page book. The digital experience just hasn’t caught up — especially when playing remotely.
So, with our Storyteller Jonathan leading the way, I built one for our table.
This is the story of Codex of Blood: Las Vegas by Night — a fully custom TTRPG companion web app I built (with the help of Claude) for our ongoing Vampire: The Masquerade 5th Edition chronicle set in Las Vegas. It’s a progressive web app built to run on mobile, packed with features that live tabletop play actually needs: digital character sheets, a 3D physics dice roller, an AI-powered rules companion, a live session screen, and more.
The Problem with Existing TTRPG Digital Tools
Let me be upfront: there are existing tools. D&D Beyond is excellent for 5e. Roll20 is a full virtual tabletop. Demiplane is building out character builders for games like VtM. These are credible tools and I appreciate them as I learned about this game in general.
But none of them solved my specific problem — accessibility into each player’s character and data. I needed something the five players could pull up on their iPhones during the session and have everything they need — character sheet, dice, quick rules reference with search — without losing immersion.
More than that, I wanted the aesthetic to match the game. VtM is gothic, literary, morally complex. No generic tabletop RPG app feels like that. I wanted something that felt like it belonged in the World of Darkness.
I wanted something my players could open on their phone and immediately feel like they were in the chronicle.
So I started building — and getting some really good feedback from the Storyteller along the way.
What Codex of Blood Actually Does
After weeks of development — evenings, weekends, a lot of late nights — here’s what the app delivers for the five players running the Las Vegas Chronicle:
Las Vegas Chronicle · VtM 5e
What Codex of Blood Actually Does
Digital Character Sheet
Full VtM 5e sheet with auto-save, hero card, and section tabs for Identity, Vitals, Attributes, Skills, Disciplines, XP, and Chronicle Notes.
3D Physics Dice Roller
Actual d10 pentagonal trapezohedra tumbling on a procedural wood-grain tabletop — powered by Three.js WebGL. Not animated sprites. Real physics.
Grimoire AI Rules Companion
Powered by Claude. Knows the full V5 ruleset and reads that player’s live character sheet — so it can answer “what’s my dice pool for this?” with their actual stats.
Full Reference Tab
All 14 clans, all 11 disciplines, 14 VtM cults, rules quick-reference cards, and a complete V5 mechanics cheat sheet — searchable, all in-app.
Live Session Screen
A shared URL on screenshare showing the active map, live Hunger and Humanity for every player, and a cinematic dice roll reveal for every roll. Bestial Failure shakes the screen.
Magic Link Auth
No passwords. Players enter their email and get a login link. Zero friction on mobile — exactly where the app lives.
Blood Checks
One-tap buttons for Blood Surge, Remorse, and Hunger Frenzy — all running through the same full 3D physics dice engine.
Storyteller Email Center
Send in-character emails to players from within the admin — Story Hooks, NPC Messages, Session Recaps, and fully custom HTML emails with a live preview before sending.
All of this is a single WordPress plugin. One codebase.
The Tech Stack Breakdown for Developers
WordPress + Kadence theme · PHP 8.3 · Custom REST API · Three.js r128 · WebGL / Canvas API · Anthropic Claude API · WP Mail SMTP · Cloudflare CDN · PWA
The plugin completely bypasses the theme on its custom page templates — the app renders as a standalone mobile-first PWA with no WordPress chrome visible. It has its own database tables, its own REST API, its own auth system, and its own admin panel.
The 3D Dice Roller
VtM uses d10s — specifically ten-sided pentagonal trapezohedra. I wanted real physics, not animated sprites. Three.js gave me the WebGL renderer with gravity, bounce, and collision detection. Regular dice roll in black with gold numbers, Hunger dice in crimson. The number color tells you what it means instantly — gold is a Critical (10), red is a Bestial failure, green is a standard success. The wood-grain tabletop underneath is generated fresh each session via Canvas API — no external assets needed.
The Grimoire AI
The “Grim-whar” Grimoire tab is an AI rules companion — think “rules lawyer you can actually ask anything.” The key is that it reads the player’s live character sheet and injects it into every query. Ask “what’s my dice pool for seducing the Prince?” and it responds with your actual Charisma + Persuasion value, your Blood Potency modifier, relevant discipline bonuses — because it has your sheet right there. It’s built on Anthropic’s Claude API with a server-side system prompt encoding the full V5 ruleset.
The Live Session Screen
During game night, I put codexofblood.com/session on screenshare. It shows the active map, all five players’ current Hunger and Humanity in real time, and a cinematic full-screen dice reveal every time any player rolls on their phone. Bestial Failure triggers a blood-red wash and screen shake. Messy Critical gets an amber flicker. The whole table reacts. It turns a phone tap into a moment.
Why WordPress? (And Why It Actually Works)
I know what some of you are thinking. WordPress? For a game app? Hear me out.
WordPress gave me a mature authentication system, a media library, email infrastructure, a plugin architecture I know well, and a hosting ecosystem with manageable costs. The custom REST API routes, database abstraction, the role system — I got all of that for free and spent my time building actual features instead of scaffolding.
The trick is that the plugin completely hides WordPress on its page templates. Players never see an admin bar, a theme, a sidebar. They see a dark, gothic, mobile-first app that feels like it was built for the World of Darkness. Because it was.
The plugin completely hides WordPress. Players see the app — styled for the chronicle.
What I’d Tell Any Game Master Thinking About Building This
A few honest lessons from the build:
Start with authentication. Magic links were the right call for a player-facing mobile app. Nobody wants to create an account and remember a password to check their character sheet mid-session. One email, one tap, you’re in.
iOS will humble you. Every input needs font-size 16px minimum or iOS auto-zooms on focus and breaks your layout. WebKit has its own opinions about text color. Cloudflare can strip authentication headers on POST requests. The gap between “works on desktop” and “works on iPhone at the table” is full of landmines.
The aesthetic matters as much as the features. I’ve shipped features players barely noticed and visual details they talked about for sessions afterward. The 3D dice physics. The screen shake on a Bestial Failure. The parchment character sheet. The pulsing blood-red header. These are the things that make the app feel like Vampire instead of a generic tool.
Scope it to your table. Codex of Blood is built for exactly five players in exactly one chronicle in exactly one city. That constraint made every decision easier. I didn’t have to solve for any TTRPG system or any group size. I solved for my table. The result fits like a glove.
What’s Next
The long-term vision and goal is to open Codex of Blood as a hosted SaaS platform — where Storytellers can subscribe (free + premium) and run their own chronicles on the Codex infrastructure, the way you’d spin up a site but for a tabletop RPG campaign. The database schema and REST API are already architected for it.
In the near term: I need to continue on OUR sessions as we attempt to follow the rules through the night. You can check out the session updates on the website – just click the link below!
If you’re a Storyteller, a Game Master, or a developer who loves TTRPGs and has thought about building something like this — I’d love to hear from you. This thing started as a problem I had at my own table, and I suspect I’m not the only one who had it.
The chronicle continues. Are you ready for the next session?
