Sandbox

All of the @bristlecone/components are available in these docs!

Bristlecone components leverage live editing capabilities for each corresponding example, so usage examples lend themselves to being more transparent for usage and editing in real-time so you can tryout changes to props on-the-fly. For example, the below component is a composition of the Box, Heading, BorderBox and Text components; try passing a color prop to the Text component with a string value of red.5. Cool, huh?

¡Hola Mundo!

This is a box with some mono text.
<Box p={4}>
  <Heading>¡Hola Mundo!</Heading>
  <BorderBox my={4} p={2}>
    This is a box with <Text fontFamily="mono">some mono text</Text>.
  </BorderBox>
</Box>

You can expirement with other prop values for any of the composited components as defined in each components' respective usage examples. Check out the colors and theme section to learn more about the default styles used by components.