Back to Templates

{Client Name} Web Style Guide

Color Palette

Primary
#CE3234

Secondary
#811517

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

 

Text
#3A3A3A

Typography

Lorem Ipsum Dolor

Heading 1 (Page Titles) | Font: Josefin Sans / Weight: 600 / Size: 48px / Line Height: 1.2em / Color: #3A3A3A

Lorem Ipsum Dolor

Heading 2 | Font: Josefin Sans / Weight: 600 / Size: 40px / Line Height: 1.2em / Color: #3A3A3A

Lorem Ipsum Dolor

Heading 3 | Font: Abhaya Libre / Weight: 500/ Size: 32px / Line Height: 1.2em / Color: #3A3A3A

Lorem Ipsum Dolor

Heading 4 | Font: Abhaya Libre / Weight: 600 / Size: 27px / Line Height: 1.2em / Color: #3A3A3A
Lorem Ipsum Dolor
Heading 5 | Font: Abhaya Libre / Weight: Bold / Size: 20px / Line Height: 1em / Color: #3A3A3A
Lorem Ipsum Dolor
Heading 6 | Font: Abhaya Libre / Weight: Bold / Size: 16px / Line Height: 1em / Color: #3A3A3A
Lorem Ipsum Dolor
Title 1 | Font: Josefin Sans / Weight: 600 / Size: 65px / Line Height: 1.2em / Color: #3A3A3A
Lorem Ipsum Dolor
Title 2 | Font: Josefin Sans / Weight: 600 / Size: 36px / Line Height: 1.1em / Color: #3A3A3A

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Lead Paragraph | Font: Abhaya Libre / Weight: 400 / Size: 24px / Line Height: 1em / Color: #3A3A3A

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Paragraph | Font: Abhaya Libre / Weight: 400 / Size: 18px / Line Height: 1.2em / Color: #3A3A3A

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Small Text | Font: Abhaya Libre / Weight: 400 / Size: 14px / Line Height: 1em / Color: #3A3A3A

Lorem ipsum dolor sit amet.

Accent Text | Font: Abhaya Libre / Weight: 500 / Size: 16px / Line Height: 1.2em / Color: #3A3A3A
  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit.
  • Proin gravida dolor sit amet lacus accumsan
  • Proin sodales pulvinar tempor. Sociis natoque penatibus et magnis.
  1. Lorem ipsum dolor sit amet
  2. Consectetur adipiscing elit.
  3. Proin gravida dolor sit amet lacus accumsan
  4. Proin sodales pulvinar tempor. Sociis natoque penatibus et magnis.
Lists | Font: Abhaya Libre / Weight: 400 / Size: 16px / Line Height: 1.2em / Color: #3A3A3A

Buttons & Links

Primary Button
Secondary Button

Big Link

Medium Link

Regular Link
Primary Button
Secondary Button

Big Link

Medium Link

Regular Link

Forms

[contact-form-7 id="347" title="Sample Form - Style Guide"]

Panel Examples

Two Sisters

Using their mother’s recipes, sisters Carla and Christine have brought old world Italian to Boston. With tireless devotion to their Pugliese roots, Carla and Christine serve only truly-authentic Italian recipes, ingredients, and wines.

With a patio and view of the Rose Kennedy Greenway, Nebo is a refined, classically-Italian dining experience you won’t find anywhere else in the North End. Learn more about Nebo

Make a Reservation

View Our Menus

Lorem ipsum dolor sit amet, consectetur adipiscing elit aenean euismod.

Dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Learn More

Heading Lorem Ipsum

Lorem Ipsum Dolor Sit

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet.

Call to Action

Lorem Ipsum Dolor Sit

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet.

Call to Action

Lorem Ipsum Dolor Sit

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet.

Call to Action