200+ shortcodes & items
with 2 unique styles for unlimited possibilities
Typography
Basic typography
Praesent nec magna ac pede. Mauris suscipit mauris. Nam quis erat id tortor. Phasellus at nibh nulla nulla, egestas quam eu tortor orci, id eros. Mauris neque. Pellentesque dolor. Mauris in est. Vivamus lacus sed justo. Aenean ac dignissim nibh. Suspendisse sapien. Donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla augue a.
Lorem ipsum dolor sit amet augue. Sed eu sem urna elit, non odio. Aenean lacus tellus quis ante. Fusce enim.
Aliquam ultriciesporta. Aenean ac eros sed arcu. Mauris nunc posuere cubilia Curae, Nullam et ipsum. Aliquam quis elit. Pellentesque habitant morbi tristique commodo. Suspendisse vitae lectus varius quis, tellus.Donec ullamcorper in, dapibus quam hendrerit eget, bibendum a, bibendum tempus. Pellentesque ac ipsum. Vestibulum non sem. Mauris purus. Class aptent taciti sociosqu ad litora torquent per inceptos hymenaeos. Sed.H1 Heading
H2 Heading
H3 Heading
H4 Heading
H5 Heading
H6 Heading
Praesent nec magna ac pede. Mauris suscipit mauris. Nam quis erat id tortor. Phasellus at nibh nulla nulla, egestas quam eu tortor orci, id eros. Mauris neque. Pellentesque dolor. Mauris in est. Vivamus lacus sed justo. Aenean ac dignissim nibh. Suspendisse sapien. Donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla augue a.
Lorem ipsum dolor sit amet augue. Sed eu sem urna elit, non odio. Aenean lacus tellus quis ante. Fusce enim. Aliquam ultricies porta. Aenean ac eros sed arcu. Mauris nunc posuere cubilia Curae, Nullam et ipsum. Aliquam quis elit. Pellentesque habitant morbi tristique commodo. Suspendisse vitae lectus varius quis, tellus.Donec ullamcorper in, dapibus quam hendrerit eget, bibendum a, bibendum tempus. Pellentesque ac ipsum. Vestibulum non sem. Mauris purus. Class aptent taciti sociosqu ad litora torquent per inceptos hymenaeos. Sed.
H1 Heading
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
H2 Heading
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
H3 Heading
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
H4 Heading
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
H5 Heading
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
H6 Heading
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
Dropcap
Creates a nice looking segment of text, where one letter is featured.
Example Code:
A ellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis eges tas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet ante. Donec eu libero sit amet quam egestas semper.
E issim nibh. Suspendisse sapien. Donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla au us volutpat, velit in leo ultrices gue netus et malesuada fames ac turpis egestas.
A ellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis eges tas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet ante. Donec eu libero sit amet quam egestas semper.
E issim nibh. Suspendisse sapien. Donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla au us volutpat, velit in leo ultrices gue netus et malesuada fames ac turpis egestas.
Highlight
This item creates text with a nice highlight effect.
Example Code:
Pellentesque suspendisse sapien tristique commodo. Donec enim luctus diam eu mauris
Pellentesque suspendisse sapien tristique commodo. Suspendisse vitae lectus varius quis, tellus.Donec ullamcorper in, dapibus quam hendrerit eget bibendum a, bibendum tempus. Pellentesque ac ipsum. Vestibulum non sem. Mauris purus.
Aenean ac dignissim nibh donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla augue a. Class aptent taciti sociosqu ad litora torquent per inceptos hymenaeos. Sed
Tooltip Tooltip Image
Creates a small box under regular text in which you can rollover additional information.
Example Code:
habitant tooltip senectus
Pellentesque habitant tooltip senectus et netus et malesuada fames ac turpis egestas, ultricies eget, tempor sit amet.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, Phasellus fermentum in dolor. Pellentesque facilisis tristique senectus et netustooltip with image ante. Donec eu libero sit amet quam egestas semper.
Blockquote
Example Code:
Vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor...
Vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In in leo ultrices posuere ante viverra ipsum ...
Buttons
Image
Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Nulla imperdiet sit amet magna. Vestibulum dapibus.
Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna. Vestibulum dapibus, mauris nec malesuada fames ac turpis velit, rhoncus eu, luctus et interdum adipiscing wisi. Aliquam erat ac ipsum. Integer aliquam purus. Quisque lorem tortor fringilla sed, vestibulum id, eleifend justo vel.
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper. Maecenas ullamcorper est vitae sem ornare interdum. Cum sociis natoque penatibus et magnis dis parturient
Tempor diam pede cursus vitae, ultricies eu, faucibus quis, porttitor eros cursus lectus, pellentesque eget, bibendum a, gravida ullamcorper quam. Nullam viverra consectetuer. Quisque cursus et, porttitor risus. Aliquam sem. In hendrerit nulla quam nunc, accumsan congue. Lorem ipsum primis in nibh vel risus. Sed vel lectus.
Cum sociis natoque penatibus et ultrices volutpat. Nullam wisi ultricies a, gravida vitae, dapibus risus ante sodales lectus blandit eu, tempor diam pede cursus vitae, ultricies eu, faucibus quis, porttitor eros cursus lectus, pellentesque eget, bibendum a, gravida ullamcorper quam. Nullam viverra consectetuer. Nulla imperdiet sit amet magna. Vestibulum dapibus.
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper. Maecenas ullamcorper est vitae sem ornare interdum. Cum sociis natoque penatibus et magnis dis parturient
Ordered, Unordered & Definition Lists
- Aliquam tincidunt cons ectetuer mauris eu risus
- Vestibulum auctor dapibus con sectet uer neque
- Suspendisse a pellentesque dui, non felis
- Aliquam tincidunt cons ectetuer mauris eu risus
- Vestibulum auctor dapibus con sectet uer neque
- Suspendisse a pellentesque dui, non felis
- Magna comodo
- Consectetur adipisicing elit, sed do
- Nullam wisi eu
- Quisque lorem tortor fringilla sed.
- Auctor dapibus
- Ut enim ad minim veniam, quis nostru
- Lorem ipsum dolor sit amet, consecte cons ectetuer tuer adipi sit amet magna scing elit
- Aliquam tincidunt cons ectetuer mauris eu risus
- Vestibulum auctor dapibus con sectet uer neque
- Suspendisse a pellentesque dui, non felis
- Lorem ipsum dolor sit amet, consecte cons ectetuer tuer adipi sit amet magna scing elit
- Aliquam tincidunt cons ectetuer mauris eu risus
- Vestibulum auctor dapibus con sectet uer neque
- Suspendisse a pellentesque dui, non felis
- Magna comodo
- Consectetur adipisicing elit, sed do
- Nullam wisi eu
- Quisque lorem tortor fringilla sed.
- Auctor dapibus
- Ut enim ad minim veniam, quis nostru
Bullets lists
Useful to present something within the list. We prepared several types of lists.
List check
- List item 1
- List item 2
List star
- List item 1
- List item 2
List idea
- List item 1
- List item 2
List mixed
- List item 1
- List item 2
- List item 3
Each of these lists has a different class type. To change the type of the list, simply change the name of class
- Suspendisse a pellentesque dui, non felis.
- Quisque lorem tortor fringilla sed.
- Quisque cursus et, porttitor risus.
- Nulla ipsum dolor lacus, suscipit adipiscing.
- Suspendisse a pellentesque dui, non felis.
- Quisque lorem tortor fringilla sed.
- Quisque cursus et, porttitor risus.
- Nulla ipsum dolor lacus, suscipit adipiscing.
- Suspendisse a pellentesque dui, non felis.
- Quisque lorem tortor fringilla sed.
- Quisque cursus et, porttitor risus.
- Nulla ipsum dolor lacus, suscipit adipiscing.
- Suspendisse a pellentesque dui, non felis.
- Quisque lorem tortor fringilla sed.
- Quisque cursus et, porttitor risus.
- Nulla ipsum dolor lacus, suscipit adipiscing.
Icon block
Creates icon as block element.
Example Code:
Progress icons
Animated colored progress icons.
Example Code:
Content link
Creates links with icon and content inside.
Example Code:
Vitae adipiscing Quisque lorem Fusce velit
Divider Hr
Creates spaces between elements. It also aligns a single line, with boxes located underneath. You can choose different styles of this item.
Example Code:
Google font
Alert
This item allows you to add alerts which can be closed.
Example Code:
Idea
Creates a nice box with text inside.
Example Code:
Nulla imperdiet sit amet magna. Vestibulum dapibus. Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc.
Popup
Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellen tesque facilisis.
Share Box
Share box powered by sharethis.com.
Example Code:
Table
Styling for HTML tables.
Example Code:
Employee | Salary | Bonus | Supervisor |
---|---|---|---|
Stephen C. Cox | $300 | $50 | Bob |
Salary | Bonus | Supervisor | |
---|---|---|---|
Stephen C. Cox | $300 | $50 | Bob |
Employee | Salary | Bonus | Supervisor |
---|---|---|---|
Stephen C. Cox | $300 | $50 | Bob |
Josephin Tan | $150 | - | Annie |
Joyce Ming | $200 | $35 | Andy |
James A. Pentel | $175 | $25 | Annie |
Salary | Bonus | Supervisor | |
---|---|---|---|
Stephen C. Cox | $300 | $50 | Bob |
Josephin Tan | $150 | - | Annie |
Joyce Ming | $200 | $35 | Andy |
James A. Pentel | $175 | $25 | Annie |
Icons
Large variety of retina ready icons, choose your icon below.
Example Code:
Columns
Split your content into columns.
Example Code:
2/3
Lorem ipsum dolor sit amet.