Attributes

Class name Description Code
white Define white text color
.white { color: $white; }
gray Define gray text color
.gray { color: $gray; }
black Define black text color
.black { color: $black; }
light-gray Define light gray text color
.light-gray { color: $light-gray; }
medium-gray Define medium gray text color
.medium-gray { color: $medium-gray; }
dark-gray Define dark gray text color
.dark-gray { color: $dark-gray; }
text-color Define the default text color
.text-color { color: $text-color; }
accent Define the accent text color
.accent { color: $accent; }
hard-top,
hard-start
Remove the top margin & padding of an element
.hard-start, .hard-top {
  padding-top: 0 !important;
  margin-top: 0 !important;
    }
hard-bottom,
hard-end
Remove the bottom margin & padding of an element
.hard-end, .hard-bottom {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
    }
center Align an element to center
.center { text-align: center; margin: 0 auto; }
left Align an element to left
.left { text-align: left; float: left; }
right Align an element to right
.right { text-align: right; float: right; }
font-smoothing Controls the application of anti-aliasing when fonts are rendered
.font-smoothing {
              -webkit-font-smoothing: antialiased;
              -moz-osx-font-smoothing: grayscale;
            }
link Give your anchors a special treatment
...
no-lazy Disable lazy loading on an image
fit-text New Makes scalable headlines that fill the width of a parent element.
            <h1 class="fit-text">Headline</h1>