Headings

Heading H1

<h1>Heading H1</h1>

Heading H2

<h2>Heading H2</h2>

Heading H3

<h3>Heading H3</h3>

Heading H4

<h4>Heading H4</h4>

Heading H5

<h5>Heading H5</h5>

Heading H6

<h6>Heading H6</h6>

Block Title with icon

Block Title


                    <div class="title">

                    Block Title

                    </div>

Paragraph


                  <p>Paragraph</p>

Colors for Text If we need to change any text color, add below class name to any tag ( p tag, anchor tag, heading tag, div tag etc).

Color Blue class="color-blue"

Examples:

<div class="color-blue">Color Blue</div>

<p class="color-blue">Color Blue</p>

<a class="color-blue">Color Blue</a>

Color Blue Light class="color-blue-light"

Color Dark class="color-dark"

Color Gray class="color-gray"

Color Light class="color-light"

Color Red class="color-red"

Color Green class="color-green"

Color Orange class="color-orange"

Color White class="color-white"

Backgrounds If we need to change any background color, add below class name to any tag ( p tag, anchor tag, heading tag, div tag etc).

Background Blue

class="bg-blue"

Examples:

<div class="bg-blue">Background Blue</div>

<p class="bg-blue">Background Blue</p>

<a class="bg-blue">Background Blue</a>

Background Gray

class="bg-gray"

Background White

class="bg-white"

Background Red

class="bg-red"

Background Green

class="bg-green"

Background Orange

class="bg-orange"

List Arrow

Default List Item 01
Default List Item 02
Default List Item 03
Default List Item 04
Default List Item 05


                    <ul class="list-arrow">

                        <li>Default List Item 01</li>

                        <li>Default List Item 02</li>

                        <li>Default List Item 03</li>

                        <li>Default List Item 04</li>

                        <li>Default List Item 05</li>

                    </ul>

List Bullet

Custom List Item 01
Custom List Item 02
Custom List Item 03
Custom List Item 04
Custom List Item 05


                    <ul class="list-bullet">

                        <li>Custom List Item 01</li>

                        <li>Custom List Item 02</li>

                        <li>Custom List Item 03</li>

                        <li>Custom List Item 04</li>

                        <li>Custom List Item 05</li>

                    </ul>

Buttons

Button

<a href="#" class="btn">Button</a>

(Normal Button) <button type="submit" value="" class="btn">Submit</button>
(button type="submit") <input type="submit" value="Submit" class="btn">
(input type="submit")

Button Colors

Green


                    <a href="#" class="btn btn-green">Green</a>

Button Sizes

Large


                    <a href="#" class="btn btn-lg">Large</a>

Medium


                    <a href="#" class="btn btn-md">Medium</a>

Small


                    <a href="#" class="btn btn-sm">Small</a>

Button Back

Back


                    <a href="#" class="btn btn-back">Back</a>

Form Fields

Checkbox 1

Checkbox 2

Radio 1

Radio 2

Checkbox inline 1

Checkbox inline 2

Radio inline 1

Radio inline 2

Accordion

Item 1

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.

Item 2

Item 3

Tabs

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000

.....

Modal Popup