Components
Loading preview...
A component for displaying code snippets with syntax highlighting and customizable styling.
@motion-primitives
npx shadcn@latest add https://21st.dev/r/ibelick/code-block"use client"
import { CodeBlock, CodeBlockCode } from "@/components/ui/code-block"
export function CodeBlockBasic() {
const code = `function greet(name) {
return \`Hello, \${name}!\`;
}
// Call the function
greet("World");`
return (
<div className="w-full max-w-[400px]">
<CodeBlock>
<CodeBlockCode code={code} language="javascript" />
</CodeBlock>
</div>
)
}