All HTML headings, <h1> through <h6>,are available. .h1 through .h6 are also available, for when you want to match the font styling of a heading.
Preview
Font Size
2.5rem
2rem
1.75rem
1.5rem
1.25rem
1rem
All HTML headings are available with light and bold font-weight. Use .text-bold-400 for light heading and .text-bold-600 for bold headings alongwith heading tags or classes.
Light Headings
Bold Headings
Traditional heading elements are designed to work best in the meet of your page content. When you need a heading to stand out, consider using a display heading — a larger, slightly more opinionated heading style.
For quoting blocks of content from another source within your document. Wrap <blockquote class="blockquote"> around any HTML
as the quote.
You can use .text-center or .text-right to change the alignment of your blockquote.
Cupcake ipsum dolor sit amet. Tart toffee cheesecake cupcake. Marshmallow oat cake jujubes macaroon. Carrot cake biscuit bonbon.
Add <footer class="blockquote-footer"> for identifying the source. Wrap the name of the source work in <cite>.
Cupcake ipsum dolor. Sit amet sesame snaps tiramisu. Marzipan topping gummies pudding.
Add .border-left-{color}.border-left-3 to have a left border of 3px, where color can be any color from Apex Admin color palette. You can also do it for right border.
Cupcake ipsum dolor sit amet halvah. Cake jelly chupa chups jelly-o jujubes macaroon. Icing sesame snaps jelly.
Brownie bear claw dragée macaroon powder. Gummi bears sweet caramels cupcake gummi bears halvah jelly-o chocolate. Carrot cake carrot cake danish liquorice wafer sweet candy carrot cake marshmallow. Tiramisu jujubes macaroon cookie cupcake.
Carrot cake chocolate cake fruitcake jelly beans biscuit jelly-o muffin. Lemon drops biscuit lollipop sweet roll bear claw chocolate cake oat cake sweet roll. Topping tiramisu candy canes jujubes icing macaroon cotton candy danish tiramisu.
You can use media object inside blockquote and can also customize image type, border alignment & style.
Cupcake ipsum dolor sit amet icing. Caramels sesame snaps sesame snaps halvah candy wafer. Danish sugar plum marzipan sugar plum jelly beans.
Cupcake ipsum dolor sit. Amet chocolate bar gummi bears toffee. Caramels lollipop topping sesame snaps liquorice jelly beans marzipan.
Cupcake ipsum dolor sit amet halvah. Cake jelly chupa chups jelly-o jujubes macaroon. Icing sesame snaps jelly.![]()
Use .list-unstyled for unstyled list. It removes the default list-style and left margin on list items. This only applies to immediate children list items, meaning you will need to add the class for any nested list as well.
List of items in which the order does not explicitly matter. Use .list-style-circle or .list-style-square in unordered list to add circle or square bullet points.
List of items in which the order does explicitly matter. Use <ol type="1|a|A|i|I">, The type attribute specifies the kind of marker to use in the list.
list of terms with icons, use .list-style-icons class. You can use any icon from Apex Admin icon types.
Remove a list’s bullets and apply some light margin with a combination of .list-inline and .list-inline-item.
Use inline numbers, alphabet, icons etc... for ordered Inline List.
Align terms and descriptions horizontally by using our grid system’s predefined classes (or semantic mixins). For longer terms, you can optionally add .text-truncate to truncate the text with an ellipsis.
Description lists with right aligned text in <dt> tag using .text-right