Styles

HTML apply a color by adding .color-{color} class

SCSS apply a color with the color('{color}') function

Grayscale

  • Black

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • Gray Dark

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • Gray

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • Gray Light

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • Gray Off

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • White Dark

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • White Off

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • White

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

Colors

  • Primary

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • Secondary

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • Yellow

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • Green

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

  • Red

    Suspendisse id nisi a magna lacinia lacinia sed sed purus.

Headings

  • heading 1

    social proof is the holy grail of marketing

  • heading 2

    social proof is the holy grail of marketing

  • heading 3

    social proof is the holy grail of marketing

  • heading 4

    social proof is the holy grail of marketing

  • heading 5

    social proof is the holy grail of marketing

Body text

  • paragraph

    Suspendisse id nisi a magna lacinia lacinia sed sed purus. Integer mauris enim, dignissim eu vestibulum a, semper id velit. Donec rhoncus commodo leo, egestas tempus eros commodo eu. Suspendisse eu eleifend nibh. Nulla blandit felis et mattis auctor. Ut porta diam justo, eu dapibus ligula interdum ac. Suspendisse potenti.

  • paragraph (small)

    Suspendisse id nisi a magna lacinia lacinia sed sed purus. Integer mauris enim, dignissim eu vestibulum a, semper id velit. Donec rhoncus commodo leo, egestas tempus eros commodo eu. Suspendisse eu eleifend nibh. Nulla blandit felis et mattis auctor. Ut porta diam justo, eu dapibus ligula interdum ac. Suspendisse potenti.

  • paragraph (light)

    Suspendisse id nisi a magna lacinia lacinia sed sed purus. Integer mauris enim, dignissim eu vestibulum a, semper id velit. Donec rhoncus commodo leo, egestas tempus eros commodo eu. Suspendisse eu eleifend nibh. Nulla blandit felis et mattis auctor. Ut porta diam justo, eu dapibus ligula interdum ac. Suspendisse potenti.

  • paragraph (small, light)

    Suspendisse id nisi a magna lacinia lacinia sed sed purus. Integer mauris enim, dignissim eu vestibulum a, semper id velit. Donec rhoncus commodo leo, egestas tempus eros commodo eu. Suspendisse eu eleifend nibh. Nulla blandit felis et mattis auctor. Ut porta diam justo, eu dapibus ligula interdum ac. Suspendisse potenti.

  • paragraph (strong)

    strong

  • paragraph (italic)

    italic