Panel

Panel is a flexible container that lets you quickly build cards and content blocks with consistent padding, borders and optional shadows.

Bordered Panel

This panel demonstrates the default bordered style.

Shadow Panel

This panel uses a drop shadow to elevate it above the page.

Prop
Type
Default value
Prop
hasBorder
Type
boolean
Default value
false
Prop
hasShadow
Type
boolean
Default value
false
Prop
padding
Type
'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl'
Default value
'md'
Prop
gap
Type
'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl'
Default value
'sm'
Prop
orientation
Type
'horizontal' | 'vertical'
Default value
'horizontal'
Prop
alignItems
Type
'start' | 'center' | 'end' | 'stretch'
Default value
'center'
Prop
fillWidth
Type
boolean
Default value
false
Prop
fillHeight
Type
boolean
Default value
false

© 2025 ClickHouse, Inc. HQ in the Bay Area, CA and Amsterdam, NL.