Glowup
LAYOUT · 88 / 89
Center
Center — a Material You layout component for React Native and web.
󱀫
packages/ui/src/components/Layout/Center.tsx
Live demo
Centred on both axes
Properties
0 controls
This component takes no props worth a control — see the API reference below for its full surface.
Usage
Center.tsx
<Center />
Variants
The states and shapes this component is meant to be used in.
Basic
Centred on both axes
Loading pane
Syncing your workspace
Around an empty state
󰉕
No projects yet
Create your first project to start collecting components.
API reference
Generated from the library's TypeScript, so it cannot drift from the implementation.
Props
24 on CenterProps
Also accepts everything from Omit<BoxProps, "align" | "justify">.
Filter props
󰍉
bg
ColorValue
Background — an M3 color role name or a raw color.
borderColor
ColorValue
borderWidth
number
flex
number
gap
SpacingValue
height
ViewStyle["height"]
m
SpacingValue
Margin on every edge.
mb
SpacingValue
ml
SpacingValue
mr
SpacingValue
mt
SpacingValue
mx
SpacingValue
my
SpacingValue
p
SpacingValue
Padding on every edge.
pb
SpacingValue
pl
SpacingValue
pr
SpacingValue
pt
SpacingValue
px
SpacingValue
Horizontal padding.
py
SpacingValue
Vertical padding.
radius
RadiusValue
Corner radius — a shape token name or a raw radius.
row
boolean
Lays children out horizontally instead of vertically.
width
ViewStyle["width"]
wrap
boolean
󰅁
Previous
AspectRatio
Next
Spacer
󰅂