Delaware: The Art of Typography
Delaware includes several short codes to help you with typography on your site. THere are headings, dropcaps, highlights, underline, block quotes, and lists. With these options you can ensure that the typography on your site is stylized and looks sharp.
1. Headings
Example of H1 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna.
Example of H2 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna.
Example of H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna.
Example of H4 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna.
Example of H5 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna.
Example of H6 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna.
2. HTML Styles
Lorem ipsum dolor sit amet, Strike adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna. Donec eu dolor lacus. Mauris sit amet augue in odio venenatis interdum. Cras auctor Italic Text velit, non feugiat dolor semper non. Bold Text Proin quis felis gravida justo vehicula congue. Etiam pellentesque faucibus justo, vitae ornare magna elementum nec. Vestibulum sed magna lorem. Etiam non felis magna. Cras tristique viverra lorem, Theme Color Text ac congue odio pharetra sollicitudin. Integer elementum mollis nisl, ac placerat ante consequat congue. Fusce scelerisque adipiscing euismod. Underline Text Donec pharetra pellentesque ligula, id elementum mi aliquet nec. Vivamus arcu mauris, condimentum sed rutrum vitae, tincidunt viverra risus. Duis augue magna, semper convallis lobortis vel, euismod non nibh.
3. Dropcaps
L orem ipsum dolor sit amet, Strike adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna. Donec eu dolor lacus. Mauris sit amet augue in odio venenatis interdum. Cras auctor Italic Text velit, non feugiat dolor semper non. Bold Text Proin quis felis gravida justo vehicula congue. Etiam pellentesque faucibus justo, vitae ornare magna elementum nec. Vestibulum sed magna lorem. Etiam non felis magna. Cras tristique viverra lorem, ac congue odio pharetra sollicitudin. Integer elementum mollis nisl, ac placerat ante consequat congue. Fusce scelerisque adipiscing euismod. Underline Text Donec pharetra pellentesque ligula, id elementum mi aliquet nec. Vivamus arcu mauris, condimentum sed rutrum vitae, tincidunt viverra risus. Duis augue magna, semper convallis lobortis vel, euismod non nibh.
L orem ipsum dolor sit amet, Strike adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna. Donec eu dolor lacus. Mauris sit amet augue in odio venenatis interdum. Cras auctor Italic Text velit, non feugiat dolor semper non. Bold Text Proin quis felis gravida justo vehicula congue. Etiam pellentesque faucibus justo, vitae ornare magna elementum nec. Vestibulum sed magna lorem. Etiam non felis magna. Cras tristique viverra lorem, ac congue odio pharetra sollicitudin. Integer elementum mollis nisl, ac placerat ante consequat congue. Fusce scelerisque adipiscing euismod. Underline Text Donec pharetra pellentesque ligula, id elementum mi aliquet nec. Vivamus arcu mauris, condimentum sed rutrum vitae, tincidunt viverra risus. Duis augue magna, semper convallis lobortis vel, euismod non nibh.
4. Highlights
Lorem ipsum dolor sit amet, Strike adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna. Donec eu dolor lacus. Mauris sit amet augue in odio venenatis interdum. Cras auctor Italic Text velit, non feugiat dolor semper non. Bold Text Proin quis felis gravida justo vehicula congue. Etiam pellentesque faucibus justo, vitae ornare magna elementum nec. Vestibulum sed magna lorem. Etiam non felis magna. Cras tristique viverra lorem , ac congue odio pharetra sollicitudin. Integer elementum mollis nisl, ac placerat ante consequat congue. Fusce scelerisque adipiscing euismod. Underline Text Donec pharetra pellentesque ligula, id elementum mi aliquet nec. Vivamus arcu mauris , condimentum sed rutrum vitae, tincidunt viverra risus. Duis augue magna, semper convallis lobortis vel, euismod non nibh.
5. Blockquote
Lorem ipsum dolor sit amet, Strike adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna. Donec eu dolor lacus. Mauris sit amet augue in odio venenatis interdum.
Cras auctor Italic Text velit, non feugiat dolor semper non. Bold Text Proin quis felis gravida justo vehicula congue. Etiam pellentesque faucibus justo, vitae ornare magna elementum nec.
Vestibulum sed magna lorem. Etiam non felis magna. Cras tristique viverra lorem, ac congue odio pharetra sollicitudin. Integer elementum mollis nisl, ac placerat ante consequat congue. Fusce scelerisque adipiscing euismod. Underline Text Donec pharetra pellentesque ligula, id elementum mi aliquet nec. Vivamus arcu mauris, condimentum sed rutrum vitae, tincidunt viverra risus. Duis augue magna, semper convallis lobortis vel, euismod non nibh.
6. Custom Lists Powered by Font Awesome
- Bulleted lists (like this one)
- Buttons
- Button groups
- Navigation
- Prepended form inputs
- …and many more with custom CSS
Easily replace individual bullets.
<ul class="icons-ul">
<li><i class="icon-li icon-ok"></i>Bulleted lists (like this one)</li>
<li><i class="icon-li icon-ok"></i>Buttons</li>
<li><i class="icon-li icon-ok"></i>Button groups</li>
<li><i class="icon-li icon-ok"></i>Navigation</li>
<li><i class="icon-li icon-ok"></i>Prepended form inputs</li>
<li><i class="icon-li icon-ok"></i>…and many more with custom CSS</li>
</ul>
7. Ordered & Unordered Lists
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.
8. Fluid grid system
One Half
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words. Everyone realizes why a new common language would be desirable: one could refuse to pay expensive translators. To achieve this, it would be necessary to have uniform grammar, pronunciation and more common words.
One Half
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words. Everyone realizes why a new common language would be desirable: one could refuse to pay expensive translators. To achieve this, it would be necessary to have uniform grammar, pronunciation and more common words.
One Third
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words.
One Third
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words.
One Third
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words.
One Third
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words.
Two Third
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words. Everyone realizes why a new common language would be desirable: one could refuse to pay expensive translators. To achieve this, it would be necessary to have uniform grammar, pronunciation and more common words.
One Fourth
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary.
One Fourth
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary.
One Fourth
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary.
One Fourth
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary.
One Fourth
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary.
Three Fourth
The European languages are members of the same family. Their separate existence is a myth. For science, music, sport, etc, Europe uses the same vocabulary. The languages only differ in their grammar, their pronunciation and their most common words. Everyone realizes why a new common language would be desirable: one could refuse to pay expensive translators. To achieve this, it would be necessary to have uniform grammar, pronunciation and more common words.