Applies a negative margin to allow content to bleed into the surrounding container.
<Card size="3">
  <Flex>
    <Inset side="left" mr="5">
      <Flex
        align="center"
        justify="center"
        px="7"
        style={{ background: '#24292F', height: '100%' }}
      >
        <GitHubLogoIcon color="white" height="40" width="40" />
      </Flex>
    </Inset>
    <Box style={{ maxWidth: 400 }}>
      <Text as="div" color="gray" mb="1" size="2">
        github.com
      </Text>
      <Text size="5">
        Official Node.js SDK for interacting with the AcmeCorp API.
      </Text>
    </Box>
  </Flex>
</Card>
This component is based on the div element and supports common margin props.