Flex

Use the Flex component to create flexbox layouts.

import { Flex } from 'theme-ui'

<Flex>
  <Box p={2} bg="primary" color="white" sx={{ flex: '1 1 auto' }}>
    Flex
  </Box>
  <Box p={2} bg="muted">
    Box
  </Box>
</Flex>
<Flex>
  <Box p={2} bg="primary" color="white" sx={{ flex: '1 1 auto' }}>
    Flex
  </Box>
  <Box p={2} bg="muted">
    Box
  </Box>
</Flex>