Helpers

Not Selectable Example

not-selectable (we will not be able to select the text from here) Lorem ipsum dolor sit amet consectetur adipisicing elit. Et, debitis minus nobis itaque repellat dolorum provident sequi cumque consectetur modi earum delectus qui nulla repellendus quaerat quae totam quidem aliquid.

Positions Example

center
left
right

Toggle Hide & Show Example

hide class will hide the element and show will show the element and mark it block

hide class will hide the element and show will show the element and mark it block

Blur Example

blur

Lorem ipsum, dolor sit amet consectetur adipisicing elit. Voluptatibus, laboriosam velit ratione ad quae deleniti! Quis corporis ad expedita, obcaecati incidunt voluptate, minus quidem, nam ipsa sequi iste voluptatibus nulla?

Letter Spacings Example

spacing-1 Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam perspiciatis nemo illo voluptate, ex totam iusto facilis et repellendus dignissimos voluptates inventore accusamus optio earum placeat obcaecati eligendi ad. Eos?

spacing-3 Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam perspiciatis nemo illo voluptate, ex totam iusto facilis et repellendus dignissimos voluptates inventore accusamus optio earum placeat obcaecati eligendi ad. Eos?

spacing-5 Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam perspiciatis nemo illo voluptate, ex totam iusto facilis et repellendus dignissimos voluptates inventore accusamus optio earum placeat obcaecati eligendi ad. Eos?

spacing-8 Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam perspiciatis nemo illo voluptate, ex totam iusto facilis et repellendus dignissimos voluptates inventore accusamus optio earum placeat obcaecati eligendi ad. Eos?

spacing-10 Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam perspiciatis nemo illo voluptate, ex totam iusto facilis et repellendus dignissimos voluptates inventore accusamus optio earum placeat obcaecati eligendi ad. Eos?

spacing-15 Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam perspiciatis nemo illo voluptate, ex totam iusto facilis et repellendus dignissimos voluptates inventore accusamus optio earum placeat obcaecati eligendi ad. Eos?

Paddings Example

pad-10 Inner Container

pad-20 Inner Container

pad-30 Inner Container

pad-40 Inner Container

pad-50 Inner Container

Margins Example

margin-10 Inner Container

margin-20 Inner Container

margin-30 Inner Container

margin-40 Inner Container

margin-50 Inner Container

margin-60 Inner Container

margin-70 Inner Container

margin-80 Inner Container

margin-90 Inner Container

margin-100 Inner Container

Border Radius Example

Border Radius 2 radius-2

Border Radius 5 radius-5

Border Radius 10 radius-10

Border Radius 20 radius-20

Border Radius 30 radius-30

Container Example

Container full

Lorem ipsum dolor sit amet consectetur adipisicing elit. Neque quasi consectetur qui earum! Inventore consequatur ipsa aperiam vel quod quaerat amet tempore tenetur fugiat voluptatibus reprehenderit exercitationem laudantium, iste voluptate!

Container Semi

Lorem ipsum dolor sit amet consectetur adipisicing elit. Neque quasi consectetur qui earum! Inventore consequatur ipsa aperiam vel quod quaerat amet tempore tenetur fugiat voluptatibus reprehenderit exercitationem laudantium, iste voluptate!

Container Wide

Lorem ipsum dolor sit amet consectetur adipisicing elit. Neque quasi consectetur qui earum! Inventore consequatur ipsa aperiam vel quod quaerat amet tempore tenetur fugiat voluptatibus reprehenderit exercitationem laudantium, iste voluptate!

Width Example

w-10 (10%)

w-20 (20%)

w-30 (30%)

w-40 (40%)

w-50 (50%)

w-60 (60%)

w-70 (70%)

w-80 (80%)

w-90 (90%)

w-100 (100%)

Shadows Example

Shadow 1 shadow-1

Shadow 2 shadow-2

Shadow 3 shadow-3

Shadow 4 shadow-4

Shadow 5 shadow-5