Layout

Carbon-spec compositional primitives that don't render their own meaningful chrome but enforce structural rules:

patternsstablea11y: untested3/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.

Edit JSX — preview updates livereact-live

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

<Layout orientation="vertical" gap="4">Layout</Layout>

The Storybook stories file rendered as an iframe — every variant, every size, every state, baselined for visual regression.

patterns-layout--defaultOpen in Storybook →