310-870-7009

Style Guide

Ver:SALT Date:2021 02 08

Colors

div.bkg-1
div.bkg-2
div.bkg-3
div.bkg-4
div.bkg-black
div.bkg-white
div.bkg-dgnl-1
div.bkg-grad-1
div.bkg-grad-2

This is a Heading

This is the body paragraph text

This is a Heading with class .clr-1

This is a Heading with class .clr-2

This is a Heading with class .clr-3

This is a Heading with class .clr-4

This is a Heading with class .clr-black

This is a Heading with class .clr-white

hr
.bkg-1
.bkg-2
.bkg-3
.bkg-4
.bkg-black
.bkg-white

Typography - Body

p Lorem ipsum dolor sit amet, EM consectetur STRONG adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

p Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

Hi there! I'm a bike messenger by day, aspiring actor by night, and this is my website. I live in Los Angeles, have a great dog named Jack, and I like piña coladas. (And gettin' caught in the rain.)

Steve Jobs

p Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  1. Ordered List Item
  2. Ordered List Item
  3. Ordered List Item
  4. Ordered List Item
  5. Ordered List Item

p Lorem ipsum dolor sit amet, EM consectetur STRONG adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

p Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

Hi there! I'm a bike messenger by day, aspiring actor by night, and this is my website. I live in Los Angeles, have a great dog named Jack, and I like piña coladas. (And gettin' caught in the rain.)

Steve Jobs

p Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pellentesque ante in neque sollicitudin pretium. Nullam sed nisi sagittis, volutpat arcu sed, semper nibh. Cras ac placerat nisi.

  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  1. Ordered List Item
  2. Ordered List Item
  3. Ordered List Item
  4. Ordered List Item
  5. Ordered List Item
.styled-type ol ol.num-list
  1. Ordered List Item
  2. Ordered List Item
  3. Ordered List Item
  4. Ordered List Item
  5. Ordered List Item
  6. Ordered List Item
  7. Ordered List Item
  8. Ordered List Item
  9. Ordered List Item
  10. Ordered List Item
  11. Ordered List Item
  12. Ordered List Item
.styled-type.light ol .styled-type .light ol .light ol.num-list
  1. Ordered List Item
  2. Ordered List Item
  3. Ordered List Item
  4. Ordered List Item
  5. Ordered List Item
  6. Ordered List Item
  7. Ordered List Item
  8. Ordered List Item
  9. Ordered List Item
  10. Ordered List Item
  11. Ordered List Item
  12. Ordered List Item
.styled-type ul ul.bullet-list
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
ul.check-list
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
.styled-type.light ul .styled-type .light ul .light ul.bullet-list
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
.light ul.check-list
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
ul.check-list.list-grid
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item
  • Unordered List Item

Typography - Headings

p A QUICK BROWN FOX JUMPS OVER THE LAZY DOG. A quick brown fox jumps over the lazy dog.

H1 .h1 A QUICK BROWN FOX JUMPS OVER THE LAZY DOG. A quick brown fox jumps over the lazy dog. A quick brown fox jumps over the lazy dog.

H2 .h2 A QUICK BROWN FOX JUMPS OVER THE LAZY DOG. A quick brown fox jumps over the lazy dog. A quick brown fox jumps over the lazy dog.

H3 .h3 A QUICK BROWN FOX JUMPS OVER THE LAZY DOG. A quick brown fox jumps over the lazy dog. A quick brown fox jumps over the lazy dog.

H4 .h4 A QUICK BROWN FOX JUMPS OVER THE LAZY DOG. A quick brown fox jumps over the lazy dog. A quick brown fox jumps over the lazy dog.

H5 .h5 A QUICK BROWN FOX JUMPS OVER THE LAZY DOG. A quick brown fox jumps over the lazy dog. A quick brown fox jumps over the lazy dog.
H6 .h6 A QUICK BROWN FOX JUMPS OVER THE LAZY DOG. A quick brown fox jumps over the lazy dog. A quick brown fox jumps over the lazy dog.

A QUICK brown fox.

A QUICK brown fox.

A QUICK brown fox.

A QUICK brown fox.

A QUICK brown fox.

A QUICK brown fox.

A QUICK brown fox.

A QUICK brown fox.

Buttons

A quick brown fox jumps over the lazy dog.

.button .button.hollow

A quick brown fox jumps over the lazy dog.

.button.white .button.hollow.white
.button.small .button .button.large .button.small.expanded .button.expanded .button.large.expanded

Fields & CF7 Forms