Typography
DisplayMITHeading + body + caption + code typography ramp — the type system at a glance.
bun add @otfdashkit/ui
Preview
TypographyDisplay
Loading Storybook preview…
Code
@otfdashkit/uiimport { Heading, Body, Caption, Code } from '@otfdashkit/ui'
export function Example() {
return (
<article className="max-w-2xl space-y-4">
<Caption tone="accent">Getting started</Caption>
<Heading size="xl">Design systems that ship themselves</Heading>
<Body size="lg" tone="muted">
OTF bundles primitives, blocks, and kits that snap together without the
usual back-and-forth with design.
</Body>
<Body>
Start with <Code>@otfdashkit/ui</Code> for web, <Code>@otfdashkit/ui-native</Code> for
mobile, and <Code>@otfdashkit/tokens</Code> for the palette system. All MIT,
all tree-shakeable, all AI-tool-ready.
</Body>
</article>
)
}
Free with the SDK. This component ships in @otfdashkit/ui under the MIT license.