Main Colors
Typography
Classic headings
h1. Heading 1
h2. Heading 2
h3. Heading 3
h4. Heading 4
h5. Heading 5
h6. Heading 6
Uppercase headings
h1. Heading 1
h2. Heading 2
h3. Heading 3
h4. Heading 4
h5. Heading 5
h6. Heading 6
Standard paragraph
Nullam scelerisque enim in sem molestie, non finibus eros tristique. Etiam lobortis imperdiet vehicula. In ut neque arcu. Praesent mollis mauris quis mauris mollis egestas. Suspendisse sit amet nulla vel sem varius semper et nec nisl. Sed quis sollicitudin dolor. Etiam lorem orci, suscipit gravida risus id, eleifend egestas magna. Donec aliquet nisl purus, ut ullamcorper metus porttitor ut. Praesent a ullamcorper dolor. Curabitur sollicitudin magna eget porta egestas. Sed pharetra ornare orci euismod malesuada. Quisque at finibus lectus, ac pretium ex.
Lead paragraph
Fusce pretium, elit ut tincidunt fermentum, neque nisi tristique arcu, id viverra lacus tortor sed orci. Integer eu pharetra lacus. Donec venenatis orci id dui vestibulum, vel hendrerit arcu scelerisque.
Heading with letter
H1. Heading 1
HH2. Heading 1
HH3. Heading 1
HH4. Heading 1
HH5. Heading 1
HH6. Heading 1
HH1. Heading 1
HH2. Heading 1
HH3. Heading 1
HH4. Heading 1
HH5. Heading 1
HH6. Heading 1
HBlockquotes
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Disc List
- What is Malat ?
- What are Sections ?
- How can I leave comments on posts ?
- How to create a new page ?
- How to Integrate with MailChimp
- How to change thank you message depending on the language used ?
Decimal List
- What is Malat ?
- What are Sections ?
- How can I leave comments on posts ?
- How to create a new page ?
- How to Integrate with MailChimp
- How to change thank you message depending on the language used ?
Lower Alpha List
- What is Malat ?
- What are Sections ?
- How can I leave comments on posts ?
- How to create a new page ?
- How to Integrate with MailChimp
- How to change thank you message depending on the language used ?
Upper Alpha List
- What is Malat ?
- What are Sections ?
- How can I leave comments on posts ?
- How to create a new page ?
- How to Integrate with MailChimp
- How to change thank you message depending on the language used ?
Unstyled
- What is Malat ?
- What are Sections ?
- How can I leave comments on posts ?
- How to create a new page ?
- How to Integrate with MailChimp
- How to change thank you message depending on the language used ?
Description list alignment
- Description lists
- A description list is perfect for defining terms.
- Euismod
-
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
- Malesuada porta
- Etiam porta sem malesuada magna mollis euismod.
- Truncated term is truncated
- Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
- Nesting
-
- Nested definition list
- Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.
Alerts
Full Width
Use .rounded-0 class to .alert in full width mode to remove border radius.
Callout
Primary
Mauris eu massa libero. Curabitur malesuada molestie lorem sit amet vulputate. Nulla facilisi. Vivamus non lorem at sem hendrerit maximus a eu erat. Integer imperdiet dui et sapien accumsan, scelerisque suscipit erat finibus.
Info
Mauris eu massa libero. Curabitur malesuada molestie lorem sit amet vulputate. Nulla facilisi. Vivamus non lorem at sem hendrerit maximus a eu erat. Integer imperdiet dui et sapien accumsan, scelerisque suscipit erat finibus.
Danger
Mauris eu massa libero. Curabitur malesuada molestie lorem sit amet vulputate. Nulla facilisi. Vivamus non lorem at sem hendrerit maximus a eu erat. Integer imperdiet dui et sapien accumsan, scelerisque suscipit erat finibus.
Warning
Mauris eu massa libero. Curabitur malesuada molestie lorem sit amet vulputate. Nulla facilisi. Vivamus non lorem at sem hendrerit maximus a eu erat. Integer imperdiet dui et sapien accumsan, scelerisque suscipit erat finibus.
Bootstrap Modals
Tooltips Popovers
Tooltip
Popovers
Tables
Basic table
| # | First | Last | Handle |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| 2 | Jacob | Thornton | @fat |
| 3 | Larry | the Bird |
Striped rows
| # | First | Last | Handle |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| 2 | Jacob | Thornton | @fat |
| 3 | Larry | the Bird |
Bordered table
| # | First | Last | Handle |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| 2 | Jacob | Thornton | @fat |
| 3 | Larry the Bird | ||
Hover rows
| # | First | Last | Handle |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| 2 | Jacob | Thornton | @fat |
| 3 | Larry the Bird | ||
Small table
| # | First | Last | Handle |
|---|---|---|---|
| 1 | Mark | Otto | @mdo |
| 2 | Jacob | Thornton | @fat |
| 3 | Larry the Bird | ||
List Group
Basic
- Cras justo odio
- Dapibus ac facilisis in
- Morbi leo risus
- Porta ac consectetur ac
- Vestibulum at eros
Horizontal
- Cras justo odio
- Dapibus ac facilisis in
- Morbi leo risus
- Vestibulum at eros
Blocks
Bordered
Block
In non luctus lacus. Morbi id orci diam. Donec nec ullamcorper nulla, tincidunt gravida magna. Nullam in est vel justo mattis tristique.
Block
In non luctus lacus. Morbi id orci diam. Donec nec ullamcorper nulla, tincidunt gravida magna. Nullam in est vel justo mattis tristique.
With Image Overlay
Block with Image Overlay
In non luctus lacus. Morbi id orci diam. Donec nec ullamcorper nulla, tincidunt gravida magna. Nullam in est vel justo mattis tristique.
Block with Image Overlay
In non luctus lacus. Morbi id orci diam. Donec nec ullamcorper nulla, tincidunt gravida magna. Nullam in est vel justo mattis tristique.
Feature Blocks
Default
Launch Quickly
Quisque ultrices non velit sit amet consectetur. Cras turpis dolor, facilisis a nibh non, ullamcorper facilisis mauris. Nulla rutrum arcu sed ligula malesuada, quis condimentum eros sollicitudin.
Stylish Design
Quisque ultrices non velit sit amet consectetur. Cras turpis dolor, facilisis a nibh non, ullamcorper facilisis mauris. Nulla rutrum arcu sed ligula malesuada, quis condimentum eros sollicitudin.
Bordered
Launch Quickly
Quisque ultrices non velit sit amet consectetur. Cras turpis dolor, facilisis a nibh non, ullamcorper facilisis mauris. Nulla rutrum arcu sed ligula malesuada, quis condimentum eros sollicitudin.
Stylish Design
Quisque ultrices non velit sit amet consectetur. Cras turpis dolor, facilisis a nibh non, ullamcorper facilisis mauris. Nulla rutrum arcu sed ligula malesuada, quis condimentum eros sollicitudin.
With Background
Launch Quickly
Quisque ultrices non velit sit amet consectetur. Cras turpis dolor, facilisis a nibh non, ullamcorper facilisis mauris. Nulla rutrum arcu sed ligula malesuada, quis condimentum eros sollicitudin.
Stylish Design
Quisque ultrices non velit sit amet consectetur. Cras turpis dolor, facilisis a nibh non, ullamcorper facilisis mauris. Nulla rutrum arcu sed ligula malesuada, quis condimentum eros sollicitudin.
With Image Overlay
Launch Quickly
Quisque ultrices non velit sit amet consectetur. Cras turpis dolor, facilisis a nibh non, ullamcorper facilisis mauris. Nulla rutrum arcu sed ligula malesuada, quis condimentum eros sollicitudin.
Stylish Design
Quisque ultrices non velit sit amet consectetur. Cras turpis dolor, facilisis a nibh non, ullamcorper facilisis mauris. Nulla rutrum arcu sed ligula malesuada, quis condimentum eros sollicitudin.
Slider
Avatars
Classic
Bordered
Modern
Other Components
Progress Bars
Badges
Tabs
Nam semper vel nunc nec eleifend. In pretium id tortor elementum commodo. Vestibulum ipsum nisi, pulvinar et auctor in, suscipit sed nulla. Sed fringilla eu nulla a fringilla. Ut eleifend enim augue, quis posuere mi molestie at. Donec nec felis mauris. Suspendisse placerat sem nec ligula finibus porta. Aenean vitae feugiat lacus. Suspendisse interdum a eros vitae commodo. Curabitur a lacinia libero.
Nullam faucibus suscipit ex, ut efficitur elit iaculis et. Aliquam ligula diam, dictum nec porttitor a, suscipit quis erat. Curabitur id aliquam tellus. Mauris vel luctus nibh. Donec magna velit, pharetra vel interdum at, laoreet vitae diam. Mauris eu tempor nisl. Nullam sollicitudin augue ut erat tristique, in pulvinar lectus gravida. Donec massa orci, blandit ac ornare vitae, mollis ac sapien.