Reference
Fluid Text
Fluid Text sk
Paragraph Text sk-content
Uppercase Text uppercase
Lowercase Text lowercase
Text Align Left left
Text Align Right right
Text Align Center center
Text Justify justify
Pre-Header pre-header
Pre-Header #2 pre-header-b
General Fluid Text
xSmall Text text-xs
Small Text text-s
Medium Text text-m
Large Text text-l
xLarge Text text-xl
Font Weight
font-100
font-200
font-300
font-400
font-500
font-600
font-600
font-700
font-800
font-900
Custom Fluid Headings
XXXLarge Heading heading-3xl
XXLarge Heading heading-2xl
XLarge Heading heading-xl
Large Heading heading-l
Medium Heading heading-m
Small Heading heading-s
Notices
General notice notice
Warning notice warning
Error notice error
Success notice success
Flexbox
Activate Flexbox flex
Flex Direction Row flex-row
Flex Direction Column flex-column
Justify Content Center justify-center
Align Items Center align-center
Flexbox Wrap flex-wrap
Flexbox All In One flexbox
Gap Between Items XSmall gap-xs
Gap Between Items Small gap-s
Gap Between Items Medium gap-m
Gap Between Items Large gap-l
Gap Between Items XLarge gap-xl
Bg Colors
Light Background light
Lighter Background lighter
Dark Background dark
Darker Background darker
Pre-Headers
Pre Headings pre-header
Fluid + Responsive Margins
Top Margin XSmall margin-top-xs
Bottom Margin XSmall margin-bottom-xs
Top Margin Small margin-top-s
Bottom Margin Small margin-bottom-s
Top Margin Medium margin-top-m
Bottom Margin Medium margin-bottom-m
Margin Top Large margin-top-l
Margin Bottom Large margin-bottom-l
Margin Top XLarge margin-top-xl
Margin Bottom XLarge margin-bottom-xl
Fluid + Responsive Padding
*Note: Padding is for all sides.
XSmall padding padding-xs
Small Padding padding-s
Medium Padding padding-m
Large Padding padding-l
xLarge Padding padding-xl
Remove Padding no-padding
Fluid + Responsive Sections
Full Section fullscreen
Hero Section section-xl
Large Section section-l
Medium Section section-m
Small Section section-s
Border Radius
Small Radius radius-s
Medium Radius radius-m
Large Radius radius-l
Pill radius-full
Hover
Hover Glow hover-glow
Hover Shadow hover-shadow
Hover Scale hover-scale
Hover Dark hover-dark
Hover Opacity hover-opacity
Hover Boarder hover-boarder
Shadows
Small Shadow shadow-s
Medium Shadow shadow-m
Large Shadow shadow-l
XLarge Shadow shadow-xl
Shadow Insert shadow-inset
Opacity
20% Opacity opacity-20
30% Opacity opacity-30
40% Opacity opacity-40
50% Opacity opacity-50
60% Opacity opacity-60
70% Opacity opacity-70
Glass Effect
Glass Effect glass