Ground
--color-blackThe opaque reading surface.
RSH / Reference material
Design system
This page renders the shipped primitives and effective runtime tokens. The font-size scale is Tailwind v4's default scale; the inert custom size declarations were removed without activating a new scale.
docs/typography-primitive-law.mdColor, space and surface
A dark ground, white reading voice and ember accent support the procedural field. The specimens use the runtime CSS variables; typography and its optical exceptions follow below.
Reading
--color-whitePrimary text and structural detail.
Ember
--color-primarySelective emphasis and action.
Ether
--color-etherSecondary atmosphere; check small-text contrast in context.
Spacing rhythm
2 units
4 units
6 units
8 units
12 units
16 units
Tailwind spacing units come from --spacing. Containers, sections and reading measures are demonstrated in the component catalog.
Motion and reading
Motion expresses formation, passage and a held shape. Content remains readable in its quiet state. Reduced motion removes choreography without removing the task.
Use the catalog for isolated components and imagery for the relationship between source assets and procedural expression. Page-level field behavior needs its full context.
01 / Heading
Rainer and IBM Plex Mono
The font prop is honored at every size. H5 and H6 inherit the body cascade when no font is passed — their quiet default — and take the requested family only when it is explicit, as shown here.
Rainer
H1
RSH
H2
RSH
H3
RSH
H4
RSH
H5
RSH
H6
RSH
IBM Plex Mono
H1
RSH
H2
RSH
H3
RSH
H4
RSH
H5
RSH
H6
RSH
02 / Text
Preset sizes and representative tags
Caption / span
A compact label for supporting contextSmall body / paragraph
Small body copy carries secondary information without losing its rhythm.
Body / div
Body copy is the default reading voice for sustained explanations and editorial prose.
Large body / blockquote
Large body copy opens a thought without becoming display type.
03 / Realm ladder
The realms' named voices
Named from the Phase 2A usage census: every step below is the verbatim recipe of a combination the realms already use three or more times. Micro and Nano are the two canonical steps of the converged micro-label family.
Realm body / paragraph
The realms read in this voice: quiet mono prose that grows a step at large screens.
Quiet small / paragraph
Small realm copy without the marketing tracking — the untracked sibling of small body.
Overline / span
Overline kicker before a sectionLede / paragraph
The lede opens a realm page at full breath.
Sub-lede / paragraph
The sub-lede carries the second breath under a lede.
Micro / span
Micro label · trial metadataNano / span
Nano label · faint chromeProse / paragraph
The archives read in prose: a narrow measure, a long line-height, an unhurried register.
Realm H1 / heading
The quiet display voice
04 / Tones
The ink ladder
Two opacity ladders on the two hues plus the accent, mined from the color census. Omitting the tone prop inherits the cascade. Literal grays are not tones — they belong to the static pages' theme ternaries and stay in className.
inherit (default)
The ink finds its level.
the cascade: white on blackBRIGHT
The ink finds its level.
text-whiteBODY
The ink finds its level.
text-white/85MUTED
The ink finds its level.
text-white/70GHOST
The ink finds its level.
text-white/50ETHER
The ink finds its level.
text-etherETHER_MUTED
The ink finds its level.
text-ether/70ETHER_GHOST
The ink finds its level.
text-ether/50PRIMARY
The ink finds its level.
text-primary05 / Scale
Effective font-size tokens
These named utilities were runtime-verified after the inert custom font-size declarations were removed. They are Tailwind v4's default text scale at the browser's 16px root size.
text-xs0.75rem / 12pxAatext-sm0.875rem / 14pxAatext-base1rem / 16pxAatext-lg1.125rem / 18pxAatext-xl1.25rem / 20pxAatext-2xl1.5rem / 24pxAatext-3xl1.875rem / 30pxAatext-4xl2.25rem / 36pxAatext-5xl3rem / 48pxAatext-6xl3.75rem / 60pxAatext-7xl4.5rem / 72pxAatext-8xl6rem / 96pxAatext-9xl8rem / 128pxAatext-11xl11rem / 176px — minted for H1Aa06 / Rhythm
Leading and tracking ladders
Leading
leading-none / 0.9The line finds its measure.
The next line makes it visible.
leading-tight / 1.1The line finds its measure.
The next line makes it visible.
leading-snug / 1.25The line finds its measure.
The next line makes it visible.
leading-normal / 1.5The line finds its measure.
The next line makes it visible.
leading-relaxed / 1.75The line finds its measure.
The next line makes it visible.
leading-loose / 2The line finds its measure.
The next line makes it visible.
Tracking
tracking-tightest / -0.05emMeasure the interval
tracking-tighter / -0.03emMeasure the interval
tracking-tight / -0.01emMeasure the interval
tracking-normal / 0Measure the interval
tracking-wide / 0.01emMeasure the interval
tracking-wider / 0.05emMeasure the interval
tracking-widest / 0.1emMeasure the interval
07 / Exceptions
Recorded arbitrary values
These three values were too far from their nearest named token in the orphan-snap audit. They remain recorded exceptions and candidates for deliberate named tokens; this page labels them without applying them.
- tracking-[0.35em]
- Nearest-token distance: 71.43%
- tracking-[0.24em]
- Nearest-token distance: 58.33%
- tracking-[0.02em]
- Nearest-token distance: 50%
08 / Law
UNSET preserves; presets author
UNSET doctrine
UNSET emits no preset classes. It exists for faithful rendering where an established class list already owns the typography.
Lean typography
New copy uses named tokens and primitive presets. Arbitrary values require an explicit, recorded design decision.