The Box component serves as the foundation for all other Castle UI components, including Text, Button, and more. At its core, it defaults to rendering a div element.

Usage

Import

import { Box } from '@passfort/castle'
content_copy
Copy

Style Props

Style props provide a CSS-like API which can be used to configure styles using some of our own provided theme variables (color, spacing etc)

<Box borderRadius="regular" width={10} height={10} bg="B100" />
<Box borderRadius="regular" width={10} height={10} bg="B100" />
content_copy
Copy
live example

Key Features

Providing Access to Style Props The Box component serves as a versatile container, providing developers with a rich set of style props. These props, resembling a CSS-like API, enable easy configuration using Castle UI's theme variables like color and spacing.

Composing New Components Leverage the Box component as a foundational building block for composing new elements. Combine it with other Castle UI components to create custom, reusable components tailored to your application's requirements.