Version: 3.0.0-next.36

Box

This is a generic component for low level layout needs. It is similar to a div in HTML.

Implements#

Example#

Basic#

Composition#

Basic (With Ref)#



Common use cases for Box component are:
  • Create responsive layouts with ease.
  • Provide a shorthand to pass styles via props (bg instead of backgroundColor).

Props#

NameTypeDescriptionDefault
shadownumberApplies box shadow and accepts a number from 0 to 9-
childrenJSX.ElementRenders components as Box children. Accepts a JSX.Element or an array of JSX.Element.-