Design system

Style Guide

Every token and component the wiki is built from. Toggle the theme (top right) to check both dark and light. This page ships with the site as a living reference.

Color tokens

Used by role - never hard-coded hex in components.

bg--bg
surface--surface
surface-2--surface-2
gold--gold
gold-bright--gold-bright
blue--blue
teal--teal
green--green
red--red
ink--ink

Typography

System fonts only - system-ui, -apple-system, "Segoe UI", Roboto…

Heading 1 - Decisive Strike

Heading 2 - Base Stats

Heading 3 - Ability Details

Lead paragraph. Nostalgic but sharp, concise, never marketing fluff.

Body text. The number the user came for sits at the top; everything else supports it.

Eyebrow label

Buttons

Status badges & data honesty

The trust system. A value is verified, community-labeled, or DATA_PENDING - never guessed.

Verified Needs check DATA_PENDING Featured Sourced

Verified Source: SkinSpotlights League Classic reveal - reconfirm in-client at launch.

Stat tiles

Answer-first. Real verified values shown; a missing value renders DATA_PENDING, never a guess.

Health
520 +80
Attack Damage
58.3 +4.2
Armor
22.5 +3.5
Move Speed
345
Mana / lvl
245 DATA_PENDING

Example uses verified Cho'Gath base stats.

Ability block

Keybind chip · name · cost · cooldown · exact description · damage · scalings · per-value badge.

Q
Rupture Verified
Cost90 Mana Cooldown9s

Knocks up for 1s, deals magic damage, and slows 60% for 3s.

80/135/190/245/305 +100% AP
R
Feast Ultimate Verified
Cost100 Mana Cooldown60s

Deals true damage to champions (or heavy damage to monsters). Each kill grants max Health stacks (max 6); lose half stacks on death.

300/475/650 true (champions) 1200 (monsters) +70% AP
W
Example Pending Ability Needs check
CostDATA_PENDING CooldownDATA_PENDING

Description not yet transcribed from the reveal. Renders as pending - never back-filled with modern-LoL data.

Pill filters

Data table

Sortable/filterable in the live databases. Values below are verified runes.

RuneTypeStatStatus
Mark of Attack DamageMark+1 Attack DamageVerified
Seal of ArmorSeal+1 ArmorVerified
Glyph of Ability PowerGlyph+1.2 Ability PowerVerified
Quintessence of HealthQuintessence+26 HealthVerified

Cards & champion tiles

Modern vs Classic - diff component

Layout only. Real diffs render from each champion's modernVsClassic array; until sourced, the explorer shows DATA_PENDING rather than any placeholder text.

Example Champion

ModernDATA_PENDING
ClassicDATA_PENDING
Each row is community-compiled and individually sourced. This is a layout preview - no values are claimed.

Email capture

Get in early

Be first when Classic drops.