🕰️

Clocktower Tracker

Design system

The Blood on the Clocktower component library, ported from the design project. Mantine primitives are brand-styled by the theme; these components render the design system's own gothic look (gold-foil buttons, gilt cards, team auras) driven by the token layer.

Buttons

Gold-foil solid by default; plus brand, outline, ghost, soft and danger.

Badges & tags

Alignment-carrying pills and filter chips.

SolidGoodEvilNeutralOutlineDanger
TownsfolkSelectedRemovable
TownsfolkOutsiderMinionDemonTravellerFabled

Form controls

Gold focus glow, gilt checkmarks, scroll-seal search.

As shown in the town square.
This character is already assigned.

Feedback

Alerts, progress, toasts and tooltips.

Votes62%
Good40%
Evil80%

Nomination

The Empath has nominated the Butler.
Their life token is turned over

Surfaces

Cards and avatars.

Gilded card

A surface with the gold hairline edge.

Interactive

Lifts on hover.

AGBSGGEO

Navigation

Underline and pill tabs.

The Storyteller's view.

Game tokens

The signature pieces Mantine has no equivalent for.

ImpImp
WasherwomanWasherwoman
EmpathEmpath
SeerSeer
PoisonedProtectedRed herringDead vote
AlexWasherwomanD
On trial
BramImp
Cass
Dana
TB

Imp

Demon

Each night*, choose a player: they die. If you kill yourself this way, a Minion becomes the Imp.

Empath

townsfolk

Each night, you learn how many of your 2 alive neighbours are evil.

TB

Baron

minion

There are extra Outsiders in play. [+2 Outsiders]

TB

Accessibility

Writes data-attributes on <html> the token layer responds to.

Colour-blind paletteEvil and danger shift from red to vermillion-orange; teams keep their text labels.
High contrastStronger text, borders and focus rings.
Reduce motionStills ambient animation and transitions.
Plain reading textSwaps the antique serifs for a clear sans-serif.
Text sizeScales all type in the interface.

Dusk falls

Close your eyes — night begins.