CodeTerminal
Unified terminal/code-block panel for marketing surfaces (homepage hero, developers page, header dropdown, model docs). The marketing site previously had three separate hand-rolled variants of this with different bg, blur, border-radius, and label styles. This component is the single shape they all collapse to.
Live playground
Edit the JSX below — preview updates instantly. Switch brand × tone in the toolbar to see the same component re-themed in place.
Live
Edit JSX — preview updates livereact-live
import { CodeTerminal } from "@avala/design"; <CodeTerminal>CodeTerminal</CodeTerminal>
Variants
This component doesn't have a Storybook story yet. The catalog still tracks it so the gap is visible — see
web/components/patterns/code-terminal.tsx for the source.