Text

• Layer: Component
• Base: Panda text recipe (no Ark primitive — semantic element via Dynamic)

Variants

Headings

h1 · h2 · h3

The vocabulary.

Three intents. Three only.

Morning glory at dusk

Variant	Element	Use
h1	<h1>	Page header. One per page.
h2	<h2>	Section header.
h3	<h3>	Card title, subsection.

Mono inline emphasis

Mono

--colors-accent-defaultvar(--surface)

For token references, file paths, and other code-flavoured inline content. Use <code> semantics by passing as="code" if you need it.

Uppercase metadata

Uppercase

Components · 03Sync · draft saves every 4s

For kickers, badges-as-text, and tag-like metadata that isn’t a <Tag>. Mono-cased + 0.14em tracking.

Props

Prop	Type	Default	Description
variant	'h1' | 'h2' | 'h3' | 'mono' | 'uppercase'	'h2'	Visual recipe
as	keyof JSX.IntrinsicElements	varies	Override the rendered element
children	JSX.Element	required	Text content

Plane 1 Constraints

No drop shadows, no glow, no gradient fills. All variants resolve to surface tokens only.

Accessibility

The as prop overrides the rendered element when the default semantic doesn’t fit (e.g. an h2-styled string inside a card body that should be a <p>). Always pick the element that matches the document outline, not the visual size.