Website Style Guide

Edit these styles and UI elements here and the changes will be reflected throughout your entire website.

If you have any questions, please reach out to your site administrator.

Brand Colors

Lawn Green

Hex
#7AF801

Dark Green

Hex
#0D2713

Cal Poly Green

Hex
#27521C

White

Hex
#FFFFFF

Honeydew

Hex
#F1FFF0

System Colors

Black

Hex
#000000

Eerie Black

Hex
#1B191A

Dim Gray

Hex
#666666

Anti-Flash White

Hex
#EEEEEE

Error Red

Hex
#B42318

Success Green

Hex
#027A48

Gradient 1

DL
Desktop size: 6.25rem
Mobile size: 3.2rem

Display LG

DM
Desktop size: 5rem
Mobile size: 3.75rem

Display MD

DS 
Desktop size: 3.75rem
Mobile size: 2.75rem

Display SM

DS 
Desktop size: 1.8rem
Mobile size: 1.8rem

Display XSM

DS 
Desktop size: 1.25rem
Mobile size: 1.25rem

Display XXSM

H1  
Size: 3.5 rem

Heading 1

H2  
Size: 3 rem

Heading 2

H3 
Size: 2.5 rem

Heading 3

H4
Size: 2 rrem

Heading 4

H5 
Size: 1.5 rem
Heading 5
H6
Size: 1.25 rem
Heading 6

Plain text

Badge 1
Badge 2
TXS  
Size: 0.8rem
© Copyright Legal Landscaping, LLC
TS
Size: 0.95rem
© Copyright Legal Landscaping, LLC
TM
Size: 1.2rem
© Copyright Legal Landscaping, LLC
TL  
Size: 1.5rem
© Copyright Legal Landscaping, LLC
TXL
Size: 1.8rem
© Copyright Legal Landscaping, LLC
TXXL 
Size: 2.4rem
© Copyright Legal Landscaping, LLC

Paragraphs

Paragraph XS
Size: 0.8rem
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod est tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minimego veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex each ab commodo divad consequat. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Paragraph SM
Size: 0.95rem
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad miniatom veniam, quis nostrud exercitt cupidatat non proident,  in culpa qui officia deserunt mollit anim id est laborum.
Paragraph MD
Size: 1.125rem
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim adim veniam, quids nostrud exercitation cupidatat non proident, sunt in culpa qui offici deserunt mollit anim id est laborum.
Paragraph LG
Size: 1.5rem
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Excepteur sint occaecat cupidatat non proident, inta caulpa qui officia deserunt mollit anim id est laborum.
Paragraph XL
Size: 1.8rem
Lorem ipsum dolor sit amet, consectetur adipiscing, sedowip dolore eiusmod tempor incididunt ut labore etdolore magna aliqua. Apac excepteur sint occaecat, sunt in tango. Excepteur sint occaecat cupidatat proident.
Paragraph XXL
Size: 2.4rem
Lorem ipsum dolor sit amet, consectetur adipiscing, sedowip dolore eiusmod tempor incididunt ut labore etdolore magna aliqua. Apac excepteur sint occaecat, sunt in tango.

tEXT cOLORS

Neutral Colored Text

T1 Black

T2 Eerie Black

T4 White

Solid Colored Text

Text Lawn Green

Text Cal Poly Green

Text Dark Green

Text Success Red

Text Success Green

Rich Text

Intro

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sunt in culpa qui officia deserunt mollit anim id est laborum.

1. Main Point

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Excepteur sint occaecat cupidatat non proident.

- Supporting paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. Bold Text:

  • Ordered List Item
  • Ordered List Item
  • Ordered List Item
  • Ordered List Item

- Supporting paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Excepteur sint occaecat cupidatat non proident.

“Typefaces are to the written word what different dialects are to different languages.” ― Steven Heller

2. Main Point

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea italics consequat. Excepteur sint occaecat cupidatat non proident.

- Supporting paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.

  1. Numbered List Item
  2. Numbered List Item
  3. Numbered List Item

- Supporting paragraph.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Excepteur sint occaecat cupidatat non proident.

3. Main Point

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Excepteur sint occaecat. This is a link.

Intro

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sunt in culpa qui officia deserunt mollit anim id est laborum.

1. Main Point

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Excepteur sint occaecat cupidatat non proident.

- Supporting paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. Bold Text:

  • Ordered List Item
  • Ordered List Item
  • Ordered List Item
  • Ordered List Item

- Supporting paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Excepteur sint occaecat cupidatat non proident.

“Typefaces are to the written word what different dialects are to different languages.” ― Steven Heller

2. Main Point

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea italics consequat. Excepteur sint occaecat cupidatat non proident.

- Supporting paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.

  1. Numbered List Item
  2. Numbered List Item
  3. Numbered List Item
- Supporting paragraph.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Excepteur sint occaecat cupidatat non proident.

3. Main Point

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Excepteur sint occaecat. This is a link.

Icons  /  Interface  /  Black
Icons  /  Social  /  Black
Icons  /  Misc. /  Black
Icons  /  Misc. /  Colored
Form Block  /  Text Fields  /  Inputs
Thank you! Your submission has been received!
We'll get back as soon as possible.
Oops! Something went wrong while submitting the form.
Spacers
Spacer - Variable
Layout
Section
Page Width
Section Padding
Copy link
This is for styling