earlymorning logo
Mantine
Overview
CustomizationCustomize a component inlineCSS Module patternsGlobal customizationInner workingMantine's Style propsResponsive inline propsLight mode, dark mode
LayoutFlexGroupStackSimpleGridContainerCenterDividerSpacePaperAccordion
Advanced LayoutAppshellTabsTableTable from data object
ControlsTextInputNumberInputButtonButtonGroupActionIconNative SelectSegmentedControlPagination
OverlaysModalMenu
TitleTextBox
ChartsBar Chart
ProgressNotificationsuseFormuseLocalStorageuseDisclosure
DefaultsDefault themeDark PaletteGlobal Style: ColorsGlobal style: Others
Gray Palette
earlymorning.dev / Mantine / SimpleGrid

SimpleGrid

A grid with fluid, equal-width tracks: tracks expand horizontally, while being constrained to the same width.

It's common to have a single track for mobile and more tracks for wider screens.

Join
Discord
earlymorning logo

© 2025 - All rights reserved

Overview
Customize a component inline
CSS Module patterns
Global customization
Inner working
Mantine's Style props
Responsive inline props
Light mode, dark mode
Flex
Group
Stack
SimpleGrid
Container
Center
Divider
Space
Paper
Accordion
Appshell
Tabs
Table
Table from data object
TextInput
NumberInput
Button
ButtonGroup
ActionIcon
Native Select
SegmentedControl
Pagination
Modal
Menu
Title
Text
Box
Bar Chart
Progress
Notifications
useForm
useLocalStorage
useDisclosure
Default theme
Gray Palette
Dark Palette
Global Style: Colors
Global style: Others
earlymorning.dev / Mantine / SimpleGrid

SimpleGrid

A grid with fluid, equal-width tracks: tracks expand horizontally, while being constrained to the same width.

It's common to have a single track for mobile and more tracks for wider screens.