Atomic Bulldog - UI/pattern library

6.6 - Font Families

Source: variables/_font-families.scss, line 48

Open in new window

Font Families are in the map $font-families


  • paragraph: Lato,
  • title: Rubik,
  • highlight: Rubik
  • icon: icomoon

Font Families can be called in the sass project using the functions:

font-family($font-family, $true-val:false) which will output by default the CSS variable

Usage of font-family():

  • font-family(title) => var(--font-family-title) If $use-css-var = true
  • font-family(title) => "Rubik", "Helvetica Neue", Arial, sans-serif If $use-css-var = false
  • font-family(title, true) => "Rubik", "Helvetica Neue", Arial, sans-serif