Box

RSC
Flexible layout tool with customizable styles and props for simple to complex structures.
Installation
API Reference
Important Note
This is the documentation for gluestack-ui v2 (beta). For @gluestack-ui/themed (stable) documentation, refer to gluestack-ui v1.
This is an illustration of Box component.
<Box className="bg-primary-500 p-5">
<Text className="text-typography-0">This is the Box</Text>
</Box>

Installation

Run the following command:

npx gluestack-ui add box

API Reference

To use this component in your project, include the following import statement in your file.
import { Box } from "@/components/ui/box"
export default () => <Box />

Component Props

This section provides a comprehensive reference list for the component props, detailing descriptions, properties, types, and default behavior for easy project integration.

Box

Renders a <div /> on web and a View on native.
Platform
Output
Web
<div />
Native
<View />