A focused lab: the stone palette applied to typography pairings (text colors, headings and muted copy). Each pattern lists exact classes.

Patterns#

html
<h2 class="text-stone-900 dark:text-stone-100 text-2xl font-bold">Heading</h2>
<p class="text-stone-700 dark:text-stone-300">Body copy in the palette voice.</p>
<p class="text-stone-500 text-sm">Meta / caption tier.</p>

Why these shades#

Headings sit at the deep end for contrast, body one step lighter, meta at 500 — three tiers, one palette, zero ambiguity.

Surfaces · Interactive states · Borders & dividers · Palette hub