Components

HomeComponents

Typography

H1 Style Font Size 36px

H2 Style Font Size 30px

H3 Style Font Size 24px

H4 Style Font Size 20px

H5 Style Font Size 16px
H6 Style Font Size 14px

This is paragraph style font 14px Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos temporibus ipsum quam ab accusantium quis perferendis iusto ut fugit est, aliquid dolorum! Id repellat quibusdam fugit minima assumenda ea tenetur.

This is paragraph style font 12px Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam, aspernatur optio beatae eveniet dolor ea, repellat esse excepturi, nesciunt ratione cum veritatis quibusdam voluptatem perferendis accusantium labore. A, molestias, ipsa!

You can use the mark tag to highlight text.

This line of text is meant to be treated as deleted text.

This line of text is meant to be treated as no longer accurate.

This line of text is meant to be treated as an addition to the document.

This line of text will render as underlined

This line of text is meant to be treated as fine print.

This line rendered as bold text.

This line rendered as italicized text.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Author Name Source Title
Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti ad litora torquent per conubia nostra per inceptos himenaeos.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Author Name Source Title
Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti ad litora torquent per conubia nostra per inceptos himenaeos.
Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti ad litora torquent per conubia nostra per inceptos himenaeos.
Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti ad litora torquent per conubia nostra per inceptos himenaeos.
Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti ad litora torquent per conubia nostra per inceptos himenaeos.
Theme Card
Card image cap

Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Click Here

Card image cap

Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Click Here

Card title

Card subtitle

Some quick example text to build on the card title and make up the bulk of the card's content.

Click Here Click Here

Card title

Card subtitle

Some quick example text to build on the card title and make up the bulk of the card's content.

Click Here Click Here

Card Title

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero magni sapiente minima ab. Fuga non commodi natus cum temporibus consequatur excepturi repellendus deleniti, qui dolorum facere error, ut velit ducimus.

Card Title

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero magni sapiente minima ab. Fuga non commodi natus cum temporibus consequatur excepturi repellendus deleniti, qui dolorum facere error, ut velit ducimus.

Card Title

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt sunt quaerat, eligendi ad, ipsum?.(Read More)

25 June 20XX

User Name

Read More

Card Title

Tag Line

Card Title

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Error voluptatem quia distinctio maxime blanditiis aspernatur, quae atque nulla ex laudantium veniam vitae consectetur beatae, dolorem itaque nisi, praesentium qui. Quaerat.

Card Title

Tag Line

Card Title

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Error voluptatem quia distinctio maxime blanditiis aspernatur, quae atque nulla ex laudantium veniam vitae consectetur beatae, dolorem itaque nisi, praesentium qui. Quaerat.

Header

Primary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Primary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Primary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Primary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Primary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Header

Primary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Card image cap

Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

Last updated 3 mins ago

Card image cap

Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

Last updated 3 mins ago
Card image cap

Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

Last updated 3 mins ago

Card image cap

Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

26 June XXXX
Mauris in erat justo. Nullam ac urna eu felis condimentum sit amet a augue. Sed non neque elit.Mauris in erat justo. Nullam ac urna eu felis condimentum sit amet a augue Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto magnam iure illo ...

Welcome

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...

Welcome

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...
Slider
Flex Slider 1
  • Slider Title

    Tag Line

  • Slider Title

    Tag Line

  • Slider Title

    Tag Line

  • Slider Title

    Tag Line

Owl Slider 1
Images
Accordion

Accordion Title

L Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt voluptatum amet molestiae, sint consequatur, quam. Vero enim fugit provident labore qui, autem, cum numquam ipsa repudiandae asperiores saepe mollitia, voluptatibus! Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi.

Accordion Title

A Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt voluptatum amet molestiae, sint consequatur, quam. Vero enim fugit provident labore qui, autem, cum numquam ipsa repudiandae asperiores saepe mollitia, voluptatibus! Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi.

Accordion Title

z Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt voluptatum amet molestiae, sint consequatur, quam. Vero enim fugit provident labore qui, autem, cum numquam ipsa repudiandae asperiores saepe mollitia, voluptatibus! Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi.

Accordion Title

z Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt voluptatum amet molestiae, sint consequatur, quam. Vero enim fugit provident labore qui, autem, cum numquam ipsa repudiandae asperiores saepe mollitia, voluptatibus! Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi.

Accordion Title

L Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt voluptatum amet molestiae, sint consequatur, quam. Vero enim fugit provident labore qui, autem, cum numquam ipsa repudiandae asperiores saepe mollitia, voluptatibus! Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi.

Accordion Title

A Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt voluptatum amet molestiae, sint consequatur, quam. Vero enim fugit provident labore qui, autem, cum numquam ipsa repudiandae asperiores saepe mollitia, voluptatibus! Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi.

Accordion Title

z Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt voluptatum amet molestiae, sint consequatur, quam. Vero enim fugit provident labore qui, autem, cum numquam ipsa repudiandae asperiores saepe mollitia, voluptatibus! Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi.

Accordion Title

z Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt voluptatum amet molestiae, sint consequatur, quam. Vero enim fugit provident labore qui, autem, cum numquam ipsa repudiandae asperiores saepe mollitia, voluptatibus! Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi.

Form Input
Form Input with Icon
Please Enter Valid Text!
Please Enter Valid Email Address!
Please Enter Valid Number!
Please Enter Your Query!
Form Input without Icon
Please Enter Valid Text!
Please Enter Valid Email Address!
Please Enter Valid Number!
Please Enter Your Query!
Table

BASIC TABLE

Add class .table

# Name Profession Location Hashtag
1 Dr. Daniel Barnes Orthologist California, USA #DanielBarnes
2 Dr. Cheri Aria Dermatologist Newyork, USA #CheriAria
3 Dr. Melisa Bates Gynocologist Mumbai, India #MelisaBates
4 Dr. Steve Soeren Gynocologist Mumbai, India #SteveSoeren

TABLE HOVER

Add class .table .table-hover

# Name Profession Location Hashtag
1 Dr. Daniel Barnes Orthologist California, USA #DanielBarnes
2 Dr. Cheri Aria Dermatologist Newyork, USA #CheriAria
3 Dr. Melisa Bates Gynocologist Mumbai, India #MelisaBates
4 Dr. Steve Soeren Gynocologist Mumbai, India #SteveSoeren

TABLE BORDERED

Add class .table .table-bordered

# Name Profession Location hashtag
1 Dr. Daniel Barnes Orthologist California, USA #DanielBarnes
2 Dr. Cheri Aria Dermatologist Newyork, USA #CheriAria
3 Dr. Melisa Bates Gynocologist Mumbai, India #MelisaBates
4 Dr. Steve Soeren Gynocologist Mumbai, India #SteveSoeren

TABLE STRIPED

Add class .table .table-striped

Task Progress Deadline Action
Task 1
Dec 15, 2017
Task 2
May 15, 2018
Task 3
Apr 19, 2019
Task 4
Dec 19, 2017
Task 5
Aug 15, 2017

TABLE Contextual

Add class .table and Use classes ( .table-primary, .table-success, .table-info, .table-danger, .table-warning to color table rows or individual cells.

# Name Profession Location hashtag
1 Dr. Daniel Barnes Orthologist California, USA #DanielBarnes
2 Dr. Cheri Aria Dermatologist Newyork, USA #CheriAria
3 Dr. Melisa Bates Gynocologist Mumbai, India #MelisaBates
4 Dr. Steve Soeren Gynocologist Mumbai, India #SteveSoeren

RESPONSIVE TABLE

Add class .table .table-responsive

# Name Profession Location Hashtag
1 Dr. Daniel Barnes Orthologist California, USA #DanielBarnes
2 Dr. Cheri Aria Dermatologist Newyork, USA #CheriAria
3 Dr. Melisa Bates Gynocologist Mumbai, India #MelisaBates
4 Dr. Steve Soeren Gynocologist Mumbai, India #SteveSoeren

TABLE LAYOUTS

Add class .table .table-primary-head

# Name Profession Location Username
1 Dr. Daniel Barnes Orthologist California, USA @Daniel
2 Dr. Cheri Aria Dermatologist Newyork, USA @Cheri
3 Dr. Melisa Bates Gynocologist Mumbai, India @Melisa
4 Dr. Steve Soeren Gynocologist Mumbai, India @Steve

TABLE LAYOUTS

Add class .table .table-success-head

# Name Profession Location Username
1 Dr. Daniel Barnes Orthologist California, USA @Daniel
2 Dr. Cheri Aria Dermatologist Newyork, USA @Cheri
3 Dr. Melisa Bates Gynocologist Mumbai, India @Melisa
4 Dr. Steve Soeren Gynocologist Mumbai, India @Steve

TABLE LAYOUTS

Add class .table .table-warning-head

# Name Profession Location Username
1 Dr. Daniel Barnes Orthologist California, USA @Daniel
2 Dr. Cheri Aria Dermatologist Newyork, USA @Cheri
3 Dr. Melisa Bates Gynocologist Mumbai, India @Melisa
4 Dr. Steve Soeren Gynocologist Mumbai, India @Steve

TABLE LAYOUTS

Add class .table .table-danger-head

# Name Profession Location Username
1 Dr. Daniel Barnes Orthologist California, USA @Daniel
2 Dr. Cheri Aria Dermatologist Newyork, USA @Cheri
3 Dr. Melisa Bates Gynocologist Mumbai, India @Melisa
4 Dr. Steve Soeren Gynocologist Mumbai, India @Steve

Material Table

# Name Profession Location Price Action
1 Dr. Daniel Barnes Orthologist Specilist California, USA $100
2 Dr. Cheri Aria Dermatologist Newyork, USA $200
3 Dr. Melisa Bates Gynocologist Mumbai, India $180
4 Dr. Steve Soeren Gynocologist Street London, UK $180

Selectable Table

# Name Profession Location Price Action
1 Dr. Daniel Barnes Orthologist Specilist California, USA $100
2 Dr. Cheri Aria Dermatologist Newyork, USA $200
3 Dr. Melisa Bates Gynocologist Mumbai, India $180
4 Dr. Steve Soeren Gynocologist Street London, UK $180
Button
List
Basic List
  • Cras justo odio
  • Dapibus ac facilisis in
  • Morbi leo risus
  • Porta ac consectetur ac
  • Vestibulum at eros
  • Morbi leo risus
  • Porta ac consectetur ac
  • Vestibulum at eros
Basic List
  • Cras justo odio
  • Dapibus ac facilisis in
  • Morbi leo risus
  • Porta ac consectetur ac
  • Vestibulum at eros
  • Morbi leo risus
  • Porta ac consectetur ac
  • Vestibulum at eros
Basic List
  • Cras justo odio
  • Dapibus ac facilisis in
  • Morbi leo risus
  • Porta ac consectetur ac
  • Vestibulum at eros
  • Morbi leo risus
  • Porta ac consectetur ac
  • Vestibulum at eros
Basic List
  • Cras justo odio
  • Dapibus ac facilisis in
  • Morbi leo risus
  • Porta ac consectetur ac
  • Vestibulum at eros
  • Morbi leo risus
  • Porta ac consectetur ac
  • Vestibulum at eros
Basic List with Badge
  • Cras justo odio
  • Dapibus ac facilisis in14
  • Morbi leo risus14
  • Porta ac consectetur ac14
  • Vestibulum at eros14
  • Morbi leo risus14
  • Porta ac consectetur ac14
  • Vestibulum at eros14
Basic List with Badge
  • Cras justo odio
  • Dapibus ac facilisis in14
  • Morbi leo risus14
  • Porta ac consectetur ac14
  • Vestibulum at eros14
  • Morbi leo risus14
  • Porta ac consectetur ac14
  • Vestibulum at eros14
Tab bar List
Tab bar List
Categories
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
  • Asperiores quis voluptates voluptas
Dropcap

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nihil fuga odio blanditiis delectus ex quisquam suscipit assumenda in iusto fugiat ut, porro, doloribus quam laboriosam explicabo maxime sed accusamus doloremque!

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione

At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.e

At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.e

Panel
Panel with panel-default class

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum itaque ex adipisci corrupti alias obcaecati sed aspernatur nesciunt ipsam iusto, in facilis, doloribus debitis beatae vel numquam, veritatis tenetur provident.

Click Here
Panel with panel-primary class

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum itaque ex adipisci corrupti alias obcaecati sed aspernatur nesciunt ipsam iusto, in facilis, doloribus debitis beatae vel numquam, veritatis tenetur provident.

Click Here
Panel with panel-warning class

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum itaque ex adipisci corrupti alias obcaecati sed aspernatur nesciunt ipsam iusto, in facilis, doloribus debitis beatae vel numquam, veritatis tenetur provident.

Click Here
Panel with panel-success class

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum itaque ex adipisci corrupti alias obcaecati sed aspernatur nesciunt ipsam iusto, in facilis, doloribus debitis beatae vel numquam, veritatis tenetur provident.

Click Here
Panel with Icon & Dropcap

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum itaque ex adipisci corrupti alias obcaecati sed aspernatur nesciunt ipsam iusto, in facilis, doloribus debitis beatae vel numquam, veritatis tenetur provident.

Click Here
Panel with Badge Latest

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum itaque ex adipisci corrupti alias obcaecati sed aspernatur nesciunt ipsam iusto, in facilis, doloribus debitis beatae vel numquam, veritatis tenetur provident.

Click Here
Panel with Badge Latest
# Name Profession
1 Dr. Daniel Barnes Orthologist
2 Dr. Cheri Aria Dermatologist
3 Dr. Melisa Bates Gynocologist
4 Dr. Steve Soeren Gynocologist
Panel with Badge
Name Profession Action
Dr. Daniel Barnes Orthologist
Dr. Cheri Aria Dermatologist
Dr. Melisa Bates Gynocologist
Dr. Steve Soeren Gynocologist
Tabbar
Home Tab

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus, dolor alias eos veniam blanditiis perferendis ullam, animi maiores dicta magnam beatae hic praesentium inventore voluptates culpa numquam facilis, fugiat exercitationem.

Profile Tab

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas eaque perspiciatis totam adipisci itaque culpa exercitationem voluptatibus, labore eveniet ex, error et nesciunt illo ipsum accusamus ab ratione necessitatibus nihil.

Appointment Tab

Natus aspernatur ut totam quis et, repellat maiores voluptas dolore sed aliquam delectus doloremque atque dolorum accusantium a. Officia neque quas error veritatis sed, id earum voluptas! Ea, eum, ratione!

Request Tab

Error quam nostrum nihil laboriosam, consequuntur aliquam voluptas facere enim architecto dolorem optio illo pariatur, vero eum consectetur cupiditate ducimus autem culpa, aut qui. Vitae porro officia recusandae commodi animi.

Home Tab

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus, dolor alias eos veniam blanditiis perferendis ullam, animi maiores dicta magnam beatae hic praesentium inventore voluptates culpa numquam facilis, fugiat exercitationem.

Profile Tab

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas eaque perspiciatis totam adipisci itaque culpa exercitationem voluptatibus, labore eveniet ex, error et nesciunt illo ipsum accusamus ab ratione necessitatibus nihil.

Appointment Tab

Natus aspernatur ut totam quis et, repellat maiores voluptas dolore sed aliquam delectus doloremque atque dolorum accusantium a. Officia neque quas error veritatis sed, id earum voluptas! Ea, eum, ratione!

Request Tab

Error quam nostrum nihil laboriosam, consequuntur aliquam voluptas facere enim architecto dolorem optio illo pariatur, vero eum consectetur cupiditate ducimus autem culpa, aut qui. Vitae porro officia recusandae commodi animi.

Alerts

NORMAL ALERTS

DISMISSABLE ALERTS

ADDITIONAL CONTENT ALERTS

Progress Bar

Basic Progress Bar

Colored Progress Bar

Multiple Color Progress Bar

Striped Progress Bar

Task 0

Task 1

Task 2

Task 3

Task 4

Social Style

On Emergency

At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas.
Call : 0000000000
Make An Appointment