Margin top classes
These classes can be used to set margin-top.
Class: MT0
Set margin top to 0px.
Class: MT10
Set margin top to 10px.
Class: MT20
Set margin top to 20px.
Class: MT30
Set margin top to 30px.
Class: MT40
Set margin top to 40px.
Class: MT50
Set margin top to 50px.
Margin right classes
These classes can be used to set margin-right.
Class: MR0
Set margin right to 0px.
Class: MR5
Set margin right to 5px.
Class: MR10
Set margin right to 10px.
Class: MR20
Set margin right to 20px.
Class: MR30
Set margin right to 30px.
Class: MR40
Set margin right to 40px.
Class: MR50
Set margin right to 50px.
Margin bottom classes
These classes can be used to set margin-bottom.
Class: MB0
Set margin bottom to 0px.
Class: MB10
Set margin bottom to 10px.
Class: MB20
Set margin bottom to 20px.
Class: MB30
Set margin bottom to 30px.
Class: MB40
Set margin bottom to 40px.
Class: MB50
Set margin bottom to 50px.
Margin left classes
These classes can be used to set margin-left.
Class: ML0
Set margin left to 0px.
Class: ML5
Set margin left to 5px.
Class: ML10
Set margin left to 10px.
Class: ML20
Set margin left to 20px.
Class: ML30
Set margin left to 30px.
Class: ML40
Set margin left to 40px.
Class: ML50
Set margin left to 50px.
Padding top classes
These classes can be used to set padding-top.
Class: PT0
Set padding top to 0px.
Class: PT10
Set padding top to 10px.
Class: PT20
Set padding top to 20px.
Class: PT30
Set padding top to 30px.
Class: PT40
Set padding top to 40px.
Class: PT50
Set padding top to 50px.
Padding right classes
These classes can be used to set padding-right.
Class: PR0
Set padding right to 0px.
Class: PR10
Set padding right to 10px.
Class: PR20
Set padding right to 20px.
Class: PR30
Set padding right to 30px.
Class: PR40
Set padding right to 40px.
Class: PR50
Set padding right to 50px.
Class: PR100
Set padding right to 100px.
Padding bottom classes
These classes can be used to set padding-bottom.
Class: PB0
Set padding bottom to 0px.
Class: PB10
Set padding bottom to 10px.
Class: PB20
Set padding bottom to 20px.
Class: PB30
Set padding bottom to 30px.
Class: PB40
Set padding bottom to 40px.
Class: PB50
Set padding bottom to 50px.
Padding left classes
These classes can be used to set padding-left.
Class: PL0
Set padding left to 0px.
Class: PL10
Set padding left to 10px.
Class: PL20
Set padding left to 20px.
Class: PL30
Set padding left to 30px.
Class: PL40
Set padding left to 40px.
Class: PL50
Set padding left to 50px.
Class: PL100
Set padding left to 100px.
Vertical spacing classes
These classes can be used to create vertical space before or after any element, or between two elements.
E.g. before an image, after a block, between two text elements, etc.
How to use?
Take a Div element and set any one of these classes (as per your need) to it.
You can create more such classes here based on your design needs.
Class: Space 10
Creates 10px of space.
Class: Space 20
Creates 20px of space.
Class: Space 40
Creates 40px of space.
Class: Space 50
Creates 50px of space.
Class: Space 100
Creates 100px of space.
Column width classes
These classes can be used to set the width to any element.
You can create more such classes here based on your design needs.
Class: Col 12
Assigns width 100%.
Class: Col 11
Assigns width 91.67%.
Class: Col 10
Assigns width 83.33%.
Class: Col 9
Assigns width 75%.
Class: Col 8
Assigns width 66.67%.
Class: Col 7
Assigns width 58.33%.
Class: Col 6
Assigns width 50%.
Class: Col 5
Assigns width 41.67%.
Class: Col 4
Assigns width 33.33%.
Class: Col 3
Assigns width 25%.
Class: Col 2
Assigns width 16.67%.
Class: Col 1
Assigns width 8.33%.