← Components/primitives

Display

Carbon's expressive display scale, sizes 1 through 4. Used for hero copy on marketing surfaces, onboarding splashes, empty-state callouts, and full-screen transitions. Sibling to Heading (productive document outline) and Text (body/label/helper).

primitivesstablea11y: untested0/3 coverageEdit on GitHub ↗

Live playground

Edit the JSX below — preview updates instantly. Switch brand × tone in the toolbar to see the same component re-themed in place.

Livebrandtone

Edit JSX — preview updates livereact-live

import { Display } from "@avala/design";

<Display size="1" color="primary">Display</Display>

Variants

This component doesn't have a Storybook story yet. The catalog still tracks it so the gap is visible — see web/components/primitives/display.tsx for the source.