Typography
For more information on typographic alignment, styling, etc. visit Tailwind CSS
Typography Sample(s):
Font Families
- Proxima Nova - Sans Serif Font
- Proxima Nova Bold
- Museo Slab - Serif Font
For email typography styles, visit the email layout page.
Here is some Long Form Content
Here is an H1 header that will wrap at 40 characters so it doesn't look crummy
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet voluptatem id blanditiis maxime nihil optio dignissimos veritatis, eligendi repellat, magni, molestias autem sunt mollitia reiciendis aperiam. Dolore architecto quaerat dignissimos.
Pull quote congue lacinia dui, a porttitor lectus condimentum laoreet. Nunc eu ullamcorper orci. Quisque eget odio ac lectus vestibulum faucibus eget in metus.
Here is a paragraph that should be 1.5rem below the above header.
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex inventore excepturi animi dolorem nam at voluptatem, vel minima nobis ut asperiores tempore vitae maxime molestias eveniet ad magni quaerat suscipit.
Here an H2 header that also wraps at 40 characters, because headlines that are too wide for comfortable reading are totally lame.
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam nam soluta necessitatibus, reprehenderit dolores pariatur minus dolore et est doloremque debitis? Voluptas consequatur cumque maxime, enim ut quo cum itaque.
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam nam soluta necessitatibus, reprehenderit dolores pariatur minus dolore et est doloremque debitis? Voluptas consequatur cumque maxime, enim ut quo cum itaque.
Here is an H3 that also wraps at 40 characters. Should I be a slab font? I don't know?
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Quo eius, tempora quibusdam accusantium consectetur
- temporibus autem, adipisci veniam eligendi asperiores dolor enim dolores excepturi reiciendis eum omnis animi consequatur. Aut!
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex inventore excepturi animi dolorem nam at voluptatem, vel minima nobis ut asperiores tempore vitae maxime molestias eveniet ad magni quaerat suscipit.
Here is an H4 element. The H5 and H6 look just like it.
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex inventore excepturi animi dolorem nam at voluptatem, vel minima nobis ut asperiores tempore vitae maxime molestias eveniet ad magni quaerat suscipit.
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Quo eius, tempora quibusdam accusantium consectetur
- temporibus autem, adipisci veniam eligendi asperiores dolor enim dolores excepturi reiciendis eum omnis animi consequatur. Aut!
Here an H2 header that also wraps at 40 characters, because headlines that are too wide for comfortable reading are totally lame.
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam nam soluta necessitatibus, reprehenderit dolores pariatur minus dolore et est doloremque debitis? Voluptas consequatur cumque maxime, enim ut quo cum itaque.
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam nam soluta necessitatibus, reprehenderit dolores pariatur minus dolore et est doloremque debitis? Voluptas consequatur cumque maxime, enim ut quo cum itaque.
Here is an H3 that also wraps at 40 characters. Should I be a slab font? I don't know?
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex inventore excepturi animi dolorem nam at voluptatem, vel minima nobis ut asperiores tempore vitae maxime molestias eveniet ad magni quaerat suscipit.
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Quo eius, tempora quibusdam accusantium consectetur
- temporibus autem, adipisci veniam eligendi asperiores dolor enim dolores excepturi reiciendis eum omnis animi consequatur. Aut!
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex inventore excepturi animi dolorem nam at voluptatem, vel minima nobis ut asperiores tempore vitae maxime molestias eveniet ad magni quaerat suscipit.
Here is an H4 element. The H5 and H6 look just like it.
Here is a paragraph that should be 1.5rem below the above header. Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex inventore excepturi animi dolorem nam at voluptatem, vel minima nobis ut asperiores tempore vitae maxime molestias eveniet ad magni quaerat suscipit.
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Quo eius, tempora quibusdam accusantium consectetur
- temporibus autem, adipisci veniam eligendi asperiores dolor enim dolores excepturi reiciendis eum omnis animi consequatur. Aut!
Here's an H5 and it's dope as all getout
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti facere quisquam atque repellendus quae fuga molestiae sunt, alias dolorem, minus perspiciatis aliquid. Explicabo, voluptatibus accusamus repellat pariatur totam delectus mollitia.
Here's an H6 and it's dope as all getout
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti facere quisquam atque repellendus quae fuga molestiae sunt, alias dolorem, minus perspiciatis aliquid. Explicabo, voluptatibus accusamus repellat pariatur totam delectus mollitia.
<blockquote>
<p>Pull quote congue lacinia dui, a porttitor lectus condimentum laoreet. Nunc eu ullamcorper orci. Quisque eget odio ac lectus vestibulum faucibus eget in metus.</p>
</blockquote>Two-column list
- CRNA Malpractice Insurance
- Nurse Malpractice Insurance
- Nurse Practitioner Insurance
- Occupational Therapist Insurance
- Physical Therapist Malpractice Insurance
- Physician Assistant Insurance
- Registered Nurse
- Student Nurse
<div class="two-column-list">
<ul>
<li>CRNA Malpractice Insurance</li>
<li>Nurse Malpractice Insurance</li>
<li>Nurse Practitioner Insurance</li>
<li>Occupational Therapist Insurance</li>
<li>Physical Therapist Malpractice Insurance</li>
<li>Physician Assistant Insurance</li>
<li>Registered Nurse</li>
<li>Student Nurse</li>
</ul>
</div>