Style Guide

Colors

Typography

Aa Zz

Font Family: Nunito Sans

H1 header (>1025px) 72px/72px, (1024-768px) 60px/60px, (<767px) 30px/30px

H2 header (>1025px) 36px/36px, (1024-768px) 30px/30px, (<767px) 24px/30px

H3 header (>1025px) 24px/32px, (1024-768px) 24px/32px, (<767px) 21px30px

H4 header (>1025px) 21px/30px, (1024-768px) 21px/30px, (<767px) 18px/24px

H5 header (>1025px) 18px/24px, (1024-768px) 18px/24px, (<767px) 18px/24px
H6 header (>1025px) 16px/24px, (1024-768px) 16px/24px, (<767px) 16px/24px

Body 16px/24px

Lead body (>1025px) 21px/30px, (1024-768px) 21px/30px, (<767px) 18px/24px

Bullet List (unordered)
  • List item goes here
  • Another list item goes here that wraps to two lines lrem ipsum dolor sit amet
  • List item goes here
  • List item goes here
  • List item goes here

Bullet List (ordered)
  1. List item goes here
  2. Another list item goes here that wraps to two lines lrem ipsum dolor sit amet
  3. List item goes here
  4. List item goes here
  5. List item goes here

Block Quote Example

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut non augue at lacus tristique consectetur eu vel orci. Aliquam venenatis velit quis interdum porttitor. In ac ipsum cursus, tempus odio id, sagittis dui. Sed sodales pharetra nulla, in aliquet tellus. Morbi ultricies risus quam, et dignissim ipsum mattis id. Vivamus vestibulum nibh fermentum mauris aliquet, vitae tincidunt ante pellentesque. Integer malesuada posuere sagittis.

Cras non lacinia augue. Quisque mauris arcu, facilisis luctus nibh sed, dapibus suscipit diam. Nam at ante semper, mattis quam ac, congue est. Nulla at nibh a nisl consequat suscipit quis id neque. Nunc interdum ipsum dolorat ante semper.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut non augue at lacus tristique consectetur eu vel orci. Aliquam venenatis velit quis interdum porttitor. In ac ipsum cursus, tempus odio id, sagittis dui. Sed sodales pharetra nulla, in aliquet tellus. Morbi ultricies risus quam, et dignissim ipsum mattis id. Vivamus vestibulum nibh fermentum mauris aliquet, vitae tincidunt ante pellentesque. Integer malesuada posuere sagittis.

Forms

Tables

Column 1 Title Column 2 Title Column 3 Title
Column 1 Title:Item 1 Column 2 Title:Item 1 Column 3 Title:Lorem ipsum dolor sit amet, consectetur adipiscing elit
Column 1 Title:Item 2 Column 2 Title:Item 2 Column 3 Title:Mauris semper, eros eget interdum finibus
Column 1 Title:Item 3 Column 2 Title:Item 3 Column 3 Title:Lorem ipsum dolor sit amet, consectetur adipiscing elit
Column 1 Title:Item 4 Column 2 Title:Item 4 Column 3 Title:Mauris semper, eros eget interdum finibus
Column 1 Title:Item 5 Column 2 Title:Item 5 Column 3 Title:Lorem ipsum dolor sit amet, consectetur adipiscing elit
Column 1 Title:Item 6 Column 2 Title:Item 6 Column 3 Title:Mauris semper, eros eget interdum finibus

Navigation

Tab One

Tab Two

Tab Three

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas commodo, neque in feugiat tempus, sapien eros aliquam ligula, ac gravida arcu ex sed arcu. Nunc imperdiet felis at urna dignissim fermentum. Mauris semper, eros eget interdum finibus, massa ante venenatis felis, auctor tincidunt dolor tortor sed odio. Ut eros urna, cursus in lobortis vel, porta vitae ipsum. Quisque sem sapien, faucibus at posuere sed, convallis sed sapien. Vestibulum non molestie ipsum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas commodo, neque in feugiat tempus, sapien eros aliquam ligula, ac gravida arcu ex sed arcu.

Tab Three

Accordion One

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas commodo, neque in feugiat tempus, sapien eros aliquam ligula, ac gravida arcu ex sed arcu. Nunc imperdiet felis at urna dignissim fermentum. Mauris semper, eros eget interdum finibus, massa ante venenatis felis, auctor tincidunt dolor tortor sed odio. Ut eros urna, cursus in lobortis vel, porta vitae ipsum. Quisque sem sapien, faucibus at posuere sed, convallis sed sapien. Vestibulum non molestie ipsum.

Accordion Two

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas commodo, neque in feugiat tempus, sapien eros aliquam ligula, ac gravida arcu ex sed arcu. Nunc imperdiet felis at urna dignissim fermentum. Mauris semper, eros eget interdum finibus, massa ante venenatis felis, auctor tincidunt dolor tortor sed odio. Ut eros urna, cursus in lobortis vel, porta vitae ipsum. Quisque sem sapien, faucibus at posuere sed, convallis sed sapien. Vestibulum non molestie ipsum.

Accordion Three

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas commodo, neque in feugiat tempus, sapien eros aliquam ligula, ac gravida arcu ex sed arcu. Nunc imperdiet felis at urna dignissim fermentum. Mauris semper, eros eget interdum finibus, massa ante venenatis felis, auctor tincidunt dolor tortor sed odio. Ut eros urna, cursus in lobortis vel, porta vitae ipsum. Quisque sem sapien, faucibus at posuere sed, convallis sed sapien. Vestibulum non molestie ipsum.

Get started

To evaluate if DoubleCheck is right for you, please submit the form below; we will contact you within 24 hours. As part of the conversation, we will help assess the risks in your payment processes.

Don’t wait until you’ve been hit.