Code

分类:

other

日期:

2022-1-10

标签:

chakra

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#

import { Code } from '@chakra-ui/react';

Usage#

<Code>Hello world</Code>

Colors#

You can change the color scheme of the component by passing the colorScheme prop.

<Stack direction="row">
<Code children="console.log(welcome)" />
<Code colorScheme="red" children="var chakra = 'awesome!'" />
<Code colorScheme="yellow" children="npm install chakra" />
</Stack>

Props#

colorScheme

"whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "linkedin" | "facebook" | "messenger" | "whatsapp" | "twitter" | "telegram"
"gray"

size

Sizes Code

string

variant

"solid" | "subtle" | "outline"
"subtle"
footer logo

© 2022 Designed with chakra ui. Powered by contentlayerjs and nextjs etc. All rights reserved

TwitterYouTubeGithub