A compact code snippet block with a filename header, line numbers and a copy-to-clipboard button, ideal for showing code output in AI chat interfaces.
import { CodeBlock } from "@/components/ui/code-block"; const code = `export const sum = (a: number, b: number) => a + b; export const clamp = (n: number, min: number, max: number) => Math.min(Math.max(n, min), max);`; export default function CodeBlockDemo() { return ( <div className="flex min-h-[320px] w-full items-center justify-center p-6"> <div className="w-full max-w-md"> <CodeBlock lang="utils.ts" code={code} /> </div> </div> ); }
Part of AIcss — browse the full library on 21st.dev.