Your first Component

Please go through these pages to understand more of chakra's basic styling & components that are available

• Styling : https://chakra-ui.com/docs/styled-system/overview

• Components : https://chakra-ui.com/docs/components/overview

Button

Now, let's make a button component in About.jsx import button and put it below import React from 'react'

import { Button } from '@chakra-ui/react'

delete

<Button colorScheme='blue'>About</Button>

and put

<div>About</div>

Box

sometimes for layoutin section

import { box } from '@chakra-ui/react'

fuction Box() {
return (
    <Box bg='tomato' w='100%' p={4} color='white'>
      This is the Box
    </Box>
)
}