Code is a component used to display inline code. It is composed from the
Box component with a font family of mono
for displaying code.
import { CCode } from '@chakra-ui/vue';
Hello world
<c-code>Hello world</c-code>
You can change the color scheme of the component by passing the variantColor
prop.
console.log(welcome)
var chakra = 'awesome!'>
npm install chakra
<c-stack is-inline>
<c-code>console.log(welcome)</c-code>
<c-code variant-color="red">var chakra = 'awesome!'></c-code>
<c-code variant-color="yellow">npm install chakra</c-code>
</c-stack>
Name | Type | Default | Description |
---|---|---|---|
variantColor | string | The color scheme to use for the code. |
Name | Description |
---|---|
default | Used for the CCode content |
Caught a mistake or want to contribute to the documentation? Edit this page on GitHub!