Jibe websites have common typographic needs: clear and consistent headings, highly legible body paragraphs, clear labels, and easy-to-use input fields.

Typeface

Lato

Lato is a sans serif typeface family started in the summer of 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the Open Font License by his foundry tyPoland, with support from Google.

Lat-Img

Headings

H1

  font-size: 3.2em;
  font-weight: 700;

H2

  font-size: 2em;
  font-weight: 700;

H3

  font-size: 1.5em;
  font-weight: 700;

H4

  font-size: 1.125em;
  font-weight: 500;
H5
  font-size: 1.714em;
  font-weight: 700;
H6
  font-size: .75em;
  font-weight: 500;

Body Text

Paragraphs

"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

  font-size: 16px;
  font-weight: 300;
  line-height: normal;

Links

Links lead users to a different page or further information.

Navigation Links

  font-size: 1.14285714em;
  text-decoration: none;

  :hover {
    text-decoration: underline;
  }

  :active {
    outline: 0;
  }

List Items

Lists organize written information for users.

  • List Item
  • List Item
  • List Item
  • List Item

List Item class of "horiz-list__item"

  <li class="horiz-list__item">List Item></li>
  <li class="horiz-list__item">List Item></li>
  <li class="horiz-list__item">List Item></li>
  <li class="horiz-list__item">List Item></li>