ContextQMD
Back to Chakra Ui

Code

apps/www/content/docs/components/code.mdx

0.3.0-beta568 B
Original Source
<ExampleTabs name="code-basic" />

Usage

js
import { Code } from "@chakra-ui/react"
jsx
<Code>Hello world</Code>

Examples

Sizes

Use the size prop to change the size of the code component.

<ExampleTabs name="code-with-sizes" />

Variants

Use the variant prop to change the appearance of the code component.

<ExampleTabs name="code-with-variants" />

Colors

Use the colorPalette prop to change the color scheme of the component.

<ExampleTabs name="code-with-colors" />

Props

<PropTable component="Code" part="Code" />