Typography
Headers
Perfect pair of Varela Round and Lato fonts
Heading 1
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid aut corporis exercitationem reiciendis vero. Cumque dignissimos doloremque earum eligendi facere magni minima, officiis quidem, quisquam, ratione similique sit soluta temporibus!
Heading 2
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem, deleniti eveniet fugiat illum ipsum itaque iusto labore laudantium necessitatibus nesciunt nulla quia quisquam quod sint voluptates? Blanditiis dolor dolorem sunt.
Heading 3
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium asperiores at beatae cumque cupiditate dolor dolore error excepturi fuga hic id molestias nam nulla numquam quidem quos saepe, sequi ullam!
Heading 4
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis distinctio est labore maxime nam quasi recusandae. Alias consequatur eos iste laudantium, nihil odit omnis sit voluptatum? Aliquid explicabo voluptas voluptates.
Heading 5
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias aliquam, aspernatur at corporis dicta dolor et exercitationem minima minus nihil repellendus sapiente tenetur unde velit veritatis. Architecto dolorem libero minus.
Heading 6
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aspernatur deleniti deserunt ea error et eum ipsum iste laboriosam, officia perferendis, quam repudiandae? Animi ducimus expedita illum iusto necessitatibus, odio pariatur.
Helpers
Some css classes that will help you
.text-align-left
.text-align-center
.text-align-right
.text-gray
.text-uppercase
.text-bold
.text-italic
.text-strike-through
.text-sm-center (center text on small devices)
.text-xs-center (center text on extra small devices only)
Other
Links
Tags
Blockquote
With svg quote symbol
Code
Syntax highlighting with prism.js
<div class="card">
<div class="card-content">
<h3>Card content</h3>
<p>Lorem ipsum</p>
</div>
</div>