# API

<p class="description">The API reference of the @material-ui/system package.</p>

| Group | Import name | Prop | CSS property | Theme key |
|:------|:------------|:-----|:-------------|:----------|
| [borders](/system/borders/) | `border` | `border` | `border` | `borders` |
| [borders](/system/borders/) | `borderBottom` | `borderBottom` | `border-bottom` | `borders` |
| [borders](/system/borders/) | `borderColor` | `borderColor` | `border-color` | [`palette`](/customization/default-theme/?expand-path=$.palette) |
| [borders](/system/borders/) | `borderLeft` | `borderLeft` | `border-left` | `borders` |
| [borders](/system/borders/) | `borderRadius` | `borderRadius` | `border-radius` | [`shape`](/customization/default-theme/?expand-path=$.shape) |
| [borders](/system/borders/) | `borderRight` | `borderRight` | `border-right` | `borders` |
| [borders](/system/borders/) | `borderTop` | `borderTop` | `border-top` | `borders` |
| [shadows](/system/shadows/) | `boxShadow` | `boxShadow` | `box-shadow` | `shadows` |
| [display](/system/display/) | `displayPrint` | `displayPrint` | `display` | none |
| [display](/system/display/) | `displayRaw` | `display` | `display` | none |
| [flexbox](/system/flexbox/) | `alignContent` | `alignContent` | `align-content` | none |
| [flexbox](/system/flexbox/) | `alignItems` | `alignItems` | `align-items` | none |
| [flexbox](/system/flexbox/) | `alignSelf` | `alignSelf` | `align-self` | none |
| [flexbox](/system/flexbox/) | `flex` | `flex` | `flex` | none |
| [flexbox](/system/flexbox/) | `flexDirection` | `flexDirection` | `flex-direction` | none |
| [flexbox](/system/flexbox/) | `flexGrow` | `flexGrow` | `flex-grow` | none |
| [flexbox](/system/flexbox/) | `flexShrink` | `flexShrink` | `flex-shrink` | none |
| [flexbox](/system/flexbox/) | `flexWrap` | `flexWrap` | `flex-wrap` | none |
| [flexbox](/system/flexbox/) | `justifyContent` | `justifyContent` | `justify-content` | none |
| [flexbox](/system/flexbox/) | `order` | `order` | `order` | none |
| [palette](/system/palette/) | `bgcolor` | `bgcolor` | `backgroundColor` | [`palette`](/customization/default-theme/?expand-path=$.palette) |
| [palette](/system/palette/) | `color` | `color` | `color` | [`palette`](/customization/default-theme/?expand-path=$.palette) |
| [positions](/system/positions/) | `bottom` | `bottom`| `bottom` | none |
| [positions](/system/positions/) | `left` | `left`| `left` | none |
| [positions](/system/positions/) | `position` | `position` | `position` | none |
| [positions](/system/positions/) | `right` | `right` | `right` | none |
| [positions](/system/positions/) | `top` | `top` | `top` | none |
| [positions](/system/positions/) | `zIndex` | `zIndex` | `z-index` | [`zIndex`](/customization/default-theme/?expand-path=$.zIndex) |
| [sizing](/system/sizing/) | `height` | `height` | `height` | none |
| [sizing](/system/sizing/) | `maxHeight` | `maxHeight`| `max-height` | none |
| [sizing](/system/sizing/) | `maxWidth` | `maxWidth` | `max-width` | none |
| [sizing](/system/sizing/) | `minHeight` | `minHeight`| `min-height` | none |
| [sizing](/system/sizing/) | `minWidth` | `minWidth` | `min-width` | none |
| [sizing](/system/sizing/) | `width` | `width` | `width` | none |
| [sizing](/system/sizing/) | `boxSizing` | `boxSizing` | `box-sizing` | none |
| [spacing](/system/spacing/) | `spacing` | `m` | `margin` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `mb` | `margin-bottom` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `ml` | `margin-left` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `mr` | `margin-right` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `mt` | `margin-top` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `mx` | `margin-left`, `margin-right` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `my` | `margin-top`, `margin-bottom` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `p` | `padding` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `pb` | `padding-bottom` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `pl` | `padding-left` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `pr` | `padding-right` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `pt` | `padding-top` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `px` | `padding-left`, `padding-right` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [spacing](/system/spacing/) | `spacing` | `py` | `padding-top`, `padding-bottom` | [`spacing`](/customization/default-theme/?expand-path=$.spacing) |
| [typography](/system/typography/) | `fontFamily` | `fontFamily` | `font-family` | [`typography`](/customization/default-theme/?expand-path=$.typography) |
| [typography](/system/typography/) | `fontSize` | `fontSize` | `font-size` | [`typography`](/customization/default-theme/?expand-path=$.typography) |
| [typography](/system/typography/) | `fontWeight` | `fontWeight` | `font-weight` | [`typography`](/customization/default-theme/?expand-path=$.typography) |
| [typography](/system/typography/) | `textAlign` | `textAlign` | `text-align` | none |