Falcon UI

Box

Box is a simple, generic component that by default renders as <div>. It doesn't ship with default theme, but yet still accepts all of the responsive, theme-based style props. It's very flexible and can be used to quickly prototype new components or create one off components with custom styling needs.

xxxxxxxxxx
 
import { Box } from '@deity/falcon-ui';

Generic box component

With background & large padding

 
<Box display="grid" gridGap="md">
  <Box fontSize="lg">Generic box component</Box>
  <Box bg="secondaryLight" color="secondaryText" p="xxxl">
    With background & large padding
  </Box>
  <Box
    as="img"
    size="xxl"
    src="https://user-images.githubusercontent.com/1118933/46464650-2f40df00-c7c7-11e8-827c-576ce330cb06.png"
  />
</Box>