Base

A Bare Bones, Start-from-Scratch, Base HTML, CSS, & Javascript Setup

Typography

A simple hierarchy with vertical rhythm.

This is a heading 1

This is a heading 2

This is a heading 3

This is a heading 4

This is a heading 5
This is a heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed volutpat, lectus eu semper facilisis, purus augue egestas nisl, sit amet eleifend quam mi in augue. Curabitur tellus lorem, vulputate vitae sollicitudin vel, efficitur vel diam. Nullam pulvinar nulla sed dictum dignissim. In ornar posuere nulla, nec varius justo volutpat vitae. Nam vehicula erat vitae turpis malesuada, a fringilla neque accumsan. Vestibulum at mi felis. Nullam tristique, libero vel interdum ultrices, mauris turpis cursus nisi, ac posuere tellus orci in nisl. Duis mauris enim, consequat sit amet libero sit amet, euismod cursus neque. Integer dolor felis, commodo varius quam id, molestie lobortis tortor. Sed cursus felis ac viverra hendrerit. Praesent sodales est non lectus posuere egestas. Quisque consectetur dui a orci lacinia pretium. Donec fermentum, massa nec mollis hendrerit, lorem mi sagittis quam, a vestibulum quam arcu vitae augue.

Nulla scelerisque odio eu nulla volutpat, in aliquet sem fringilla. Integer tortor arcu, ornare vitae justo ut, volutpat malesuada sapien. Nam dictum ac augue eget molestie. Aenean a pretium ex, ac cursus sapien. Cras commodo est nec tempus fermentum. Vestibulum tempus lacus sit amet massa semper, quis dapibus lorem scelerisque. Pellentesque facilisis dignissim arcu at ullamcorper. Vivamus sed pretium nisl. In sagittis orci justo, eget viverra felis lobortis vel. Quisque finibus eu metus in congue. Proin vulputate dictum elementum. Ut euismod pharetra enim, malesuada sodales ligula sollicitudin non. Cras tincidunt sit amet nibh id rutrum. Phasellus maximus commodo nulla sed viverra. Quisque non est ex.

This is an unordered list:

  • List Item
  • List Item
  • List Item
    • List Item
    • List Item
    • List Item
  • List Item
  • List Item
  • List Item
    1. List Item
    2. List Item
    3. List Item
  • List Item
  • List Item

This is an ordered list:

  1. List Item
  2. List Item
  3. List Item
    • List Item
    • List Item
    • List Item
  4. List Item
  5. List Item
  6. List Item
    1. List Item
    2. List Item
    3. List Item
  7. List Item
  8. List Item

This is a link.

This is something bold (strong).

This is something italic (em).

This is a horizontal rule (hr).


Grid

A basic grid for layout.

One Whole Column

One-half Column

One-half Column

Two-thirds Column

One-fourth Column

One-fourth Column

One-fourth Column

One-fourth Column