Chakra UI

App.js

import { Box, Container, Heading } from '@chakra-ui/react'


const boxStyles = {
  p: '10px',
  bg: 'blue.400',
  color: 'white',
  m: '10px',
  textAlign: 'center',
  borderRadius: '5px',
}


function App() {
  return (
    <Container
      textAlign="center"
      display="flex"
      flexDirection="column"
      alignItems="center"
      justifyContent="center"
      h="100vh"
    >
      <Heading>Meu primeiro projeto utilizando Chakra-ui!</Heading>


      <Box sx={boxStyles}>
        <a
          href="https://github.com/camilacno/chakra-ui-tutorial"
          target="_blank"
          rel="noopener noreferrer"
        >
          Acesse o repositório
        </a>
      </Box>
    </Container>
  )
}


export default App