<Box padding="lg" background="#f5f5f5">
  <Text value="Content inside a box" />
</Box>

<Box 
  padding="xl" 
  background="linear-gradient(135deg, #667eea 0%, #764ba2 100%)"
  radius="lg"
>
  <Title level={2} value="Gradient Box" color="white" />
</Box>

<Box flex={1} align="center" justify="between" gap="md">
  <Text value="Left" />
  <Text value="Right" />
</Box>

<Box 
  padding="md" 
  radius="md" 
  shadow="lg"
  border="1px solid #e0e0e0"
>
  <Text value="Elevated box with border" />
</Box>

<Box padding="lg" radius="lg" shadow="md" background="white">
  <Title level={3} value="Card Title" />
  <Text value="Card content goes here" />
</Box>

<Box flex={1} align="center" justify="center">
  <Text value="Centered content" />
</Box>