API
The API reference of the @material-ui/system package.
| Group | Import name | Prop | CSS property | Theme key |
|---|---|---|---|---|
| borders | border |
border |
border |
borders |
| borders | borderBottom |
borderBottom |
border-bottom |
borders |
| borders | borderColor |
borderColor |
border-color |
palette |
| borders | borderLeft |
borderLeft |
border-left |
borders |
| borders | borderRadius |
borderRadius |
border-radius |
shape |
| borders | borderRight |
borderRight |
border-right |
borders |
| borders | borderTop |
borderTop |
border-top |
borders |
| shadows | boxShadow |
boxShadow |
box-shadow |
shadows |
| display | displayPrint |
displayPrint |
display |
none |
| display | displayRaw |
display |
display |
none |
| flexbox | alignContent |
alignContent |
align-content |
none |
| flexbox | alignItems |
alignItems |
align-items |
none |
| flexbox | alignSelf |
alignSelf |
align-self |
none |
| flexbox | flex |
flex |
flex |
none |
| flexbox | flexDirection |
flexDirection |
flex-direction |
none |
| flexbox | flexGrow |
flexGrow |
flex-grow |
none |
| flexbox | flexShrink |
flexShrink |
flex-shrink |
none |
| flexbox | flexWrap |
flexWrap |
flex-wrap |
none |
| flexbox | justifyContent |
justifyContent |
justify-content |
none |
| flexbox | order |
order |
order |
none |
| palette | bgcolor |
bgcolor |
backgroundColor |
palette |
| palette | color |
color |
color |
palette |
| positions | bottom |
bottom |
bottom |
none |
| positions | left |
left |
left |
none |
| positions | position |
position |
position |
none |
| positions | right |
right |
right |
none |
| positions | top |
top |
top |
none |
| positions | zIndex |
zIndex |
z-index |
zIndex |
| sizing | height |
height |
height |
none |
| sizing | maxHeight |
maxHeight |
max-height |
none |
| sizing | maxWidth |
maxWidth |
max-width |
none |
| sizing | minHeight |
minHeight |
min-height |
none |
| sizing | minWidth |
minWidth |
min-width |
none |
| sizing | width |
width |
width |
none |
| sizing | boxSizing |
boxSizing |
box-sizing |
none |
| spacing | spacing |
m,margin |
margin |
spacing |
| spacing | spacing |
mb,marginBottom |
margin-bottom |
spacing |
| spacing | spacing |
ml,marginLeft |
margin-left |
spacing |
| spacing | spacing |
mr,marginRight |
margin-right |
spacing |
| spacing | spacing |
mt,marginTop |
margin-top |
spacing |
| spacing | spacing |
mx,marginX |
margin-left, margin-right |
spacing |
| spacing | spacing |
my,marginY |
margin-top, margin-bottom |
spacing |
| spacing | spacing |
p,padding |
padding |
spacing |
| spacing | spacing |
pb,paddingBottom |
padding-bottom |
spacing |
| spacing | spacing |
pl,paddingLeft |
padding-left |
spacing |
| spacing | spacing |
pr,paddingRight |
padding-right |
spacing |
| spacing | spacing |
pt,paddingTop |
padding-top |
spacing |
| spacing | spacing |
px,paddingX |
padding-left, padding-right |
spacing |
| spacing | spacing |
py,paddingY |
padding-top, padding-bottom |
spacing |
| typography | fontFamily |
fontFamily |
font-family |
typography |
| typography | fontSize |
fontSize |
font-size |
typography |
| typography | fontWeight |
fontWeight |
font-weight |
typography |
| typography | textAlign |
textAlign |
text-align |
none |