---
title: 'Code Block'
description: 'Displays syntax-highlighted code with an optional header for language, title, and actions.'
sidebar:
  label: 'Code Block'
  order: 15
  badge: 'New'
---

<Component path="code-block/default" />

## With Header

Pass `title` and/or `language` to show a header with a copy button.

<Component path="code-block/with-header" />

## Custom Copy Button

Use the `actions` prop to replace the default icon-only copy button.

<Component path="code-block/custom-copy" />