Code

Inline and block code display with optional language labels and terminal style.

Inline code

Use const x = 1 to declare a constant.

tsx
<Code code="const x = 1" />

Highlighted TypeScript

Button.tsx
interface ButtonProps {
  variant?: 'primary' | 'secondary'
}

export function Button(props: ButtonProps) {
  return <button class="button">{props.variant}</button>
}
tsx
<CodeBlock code={tsxCode} lang="tsx" filename="Button.tsx" />

Highlighted HTML

html
<article class="card">
  <h2>Admin DS</h2>
  <p>Safe HTML string rendering.</p>
</article>
tsx
<CodeBlock code={htmlCode} lang="html" />

Terminal modifier

bash
pnpm install
pnpm run dev
tsx
<CodeBlock code={'pnpm install\npnpm run dev'} lang="bash" terminal />