Components
Warcraft Stories
Portrait cards
Use this component
import { PortraitCard } from "@/components/ui/LoreUI";
<PortraitCard
variant="gilded"
name="Human"
image="/assets/races/human.png"
emblem="/assets/races/alliance-logo.png"
href="/?entity=race-human&view=races"
/>Variants: gilded, silhouette, medallion, stone. Use onClick instead of href for an in-page action.
Full-art cards
Elite cards
Elite cards II
Race tiles
Faction emblems
Alliance
Horde
Alliance & Horde
Typography
Quadrata · Titles
Stories of Azeroth
The fall of a prince
Arthas Menethil
Open Sans · Reading
The story follows the people, places and choices that shaped Azeroth.
Sources and supporting notesFont files
Quadrata: /assets/chronicle/quadrata.woff2
Open Sans: /assets/chronicle/open-sans.woff
Both are defined once in the application stylesheet.
Colors & surfaces
Dark background
Stone texture
Navigation icons
Frames & dividers
