Home-Documentation-Typography Styles

Typography

image aligned leftExample of a paragraph with image aligned left. (image class = "alignleft")
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting.Aliquam vitae sapien dolor. Aliquam euismod erat eget massa volutpat quis blandit diam fringilla.

image aligned leftExample of a paragraph with image aligned right. (image class = "alignright")
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting.Aliquam vitae sapien dolor. Aliquam euismod erat eget massa volutpat quis blandit diam fringilla.

H1 ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmonpqrstuvwzyz

H2 ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmonpqrstuvwzyz

H3 ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmonpqrstuvwzyz

H4 ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmonpqrstuvwzyz

H5 ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmonpqrstuvwzyz
H6 ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmonpqrstuvwzyz

Accent Bullet Lists

  • This list item has a class name of "bullet1"
  • This list item has a class name of "bullet2"
  • This list item has a class name of "bullet3"
  • This list item has a class name of "bullet4"
  • This list item has a class name of "bullet5"
  • This list item has a class name of "bullet6"
  • This list item has a class name of "bullet7"
  • This list item has a class name of "tick"
  • This list item has a class name of "male"
  • This list item has a class name of "female"
  • This list item has a class name of "accept"
  • This list item has a class name of "clock"
  • This list item has a class name of "color"
  • This list item has a class name of "cup"
  • This list item has a class name of "date"
  • This list item has a class name of "drink"
  • This list item has a class name of "smile"
  • This list item has a class name of "exclamation"
  • This list item has a class name of "heart"
  • This list item has a class name of "music"
  • This list item has a class name of "rainbow"
  • This list item has a class name of "golf"
  • This list item has a class name of "tennis"
  • This list item has a class name of "star"
Example Usage:
<ul class="accent">
<li class="STYLE">Your text here..</li>
</ul>

This is a blockquote. The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from “de Finibus Bonorum et Malorum” by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.

This is an alert style that can easily be displayed within your content by inserting the code demonstrated above. This may help to serve your users with system error messages.- link color test
This is a informational style that can easily be displayed within your content by inserting the code demonstrated above. This may help to accent additional information within an article.- link color test
This is a warning style that can easily be displayed within your content by inserting the code demonstrated above. This may help to serve warnings before proceeding with specified steps. – link color test
This is an acceptance style that can easily be displayed within your content by inserting the code demonstrated above. You may wish to display this style when outlining success messages.- link color test
This is a download style that can easily be displayed within your content by inserting the code demonstrated above. You might use this to dispay file download links. Sample Download A | Sample Download B
This is an idea style that can easily be displayed within your content by inserting the code demonstrated above. You might use this style in instructional articles. – link color test
This is an secure style that can easily be displayed within your content by inserting the code demonstrated above. You might use this to tell your readers that something is protected or secured. – link color test
This is an author style that can easily be displayed within your content by inserting the code demonstrated above. You might use this style to give author credits for a book review. – link color test
This is an comment style that can easily be displayed within your content by inserting the code demonstrated above. You might use this to highlight a comment made or to notify your users that comments are available. – link color test
This is an tools style that can easily be displayed within your content by inserting the code demonstrated above. You might use this style to alert your readers of technical specifications. – link color test

 

The above styles can be displayed by using the code below:

<div class="note STYLE">
Your text here..
</div>
Available Classes:

(replace STYLE in the example above with)

  • alert
  • info
  • warn
  • accept
  • info
  • download
  • idea
  • secure
  • author
  • mycomment
  • tools
  • twitter
Inline Blockquotes

The examples below demonstrate an appended class of "left" or "right" to your <blockquote> tag.

 

This is a blockquote. The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from “de Finibus Bonorum et Malorum” by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting.Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting.

 

 

This is a blockquote. The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from “de Finibus Bonorum et Malorum” by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting.Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting.