Components

Frames#

Frames are a good way to showcase UI components, images or basically anything that needs to be framed.

General usage#

Frames are super simple to use, simply wrap your content in a <Frame> component. See the example below:

<Frame>
  <Button>Hello world</Button>
</Frame>

Prevent centering#

If you don't want something to be centered. You can wrap your content in <div style={{ width: '100%'}}> before putting it in a frame:

<Frame>
  <div style={{ width: '100%'}}>
    <Button>Hello world</Button>
  </div>
</Frame>

Component API - <Frame />#

The Frame component.

plainboolean

Boolean property on the style of the frame. Set to true to remove the background grid.

childrenany

The content of the frame.