Marketing System

V1.0

Type
Scale

Headings

Headline

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5 - Supheading
Heading 6 - Label
Text & paragraph

Text Large lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Text Default lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Text Small lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Text Tiny lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Type
Labels

Product labels & product breadcrumbs
Performance

Type
Styles

Font weight

Font Weight Normal

Font Weight Medium

Font Weight Semibold

Font Weight Bold

Text Transform
Text transform all caps
Text transform capitalize
Text Transform Lowercase
Text Align
Text Align Left
Text Align Center
Text Align Right
Text Decoration
Text Decoration Underline
Text Decoration Strike
Text Decoration None

Colors
Backgrounds

Background Black
Background White
Background Grey 800
Background Grey 700
Background Grey 600
Background Grey 500
Background Grey 400
Background Grey 300
Background Grey 200
Background Grey 100
Background Blue 800
Background Blue 600
Background Blue 300
Background Blue 100
Background Blue 50
Background Green 800
Background Green 600
Background Green 300
Background Green 100
Background Green 50
Background Red 800
Background Red 600
Background Red 300
Background Red 100
Background Red 50
Background Yellow 800
Background Yellow 600
Background Yellow 300
Background Yellow 100
Background Yellow 50

Colors
Texts

Color Black
Color White
Color Grey 800
Color Grey 700
Color Grey 600
Color Grey 500
Color Grey 400
Color Grey 300
Color Grey 200
Color Grey 100
Color Blue 800
Color Blue 600
Color Blue 300
Color Blue 100
Color Blue 50
Color Green 800
Color Green 600
Color Green 300
Color Green 100
Color Green 50
Color Red 800
Color Red 600
Color Red 300
Color Red 100
Color Red 50
Color Yellow 800
Color Yellow 600
Color Yellow 300
Color Yellow 100
Color Yellow 50

Elements
Buttons

buttons
Button
Primary
Default Primary
Button
Secondary
Default Primary
Video lightbox buttons

Watch now — 2min

Watch now — 2min
Watch Lattice in action — 2min
Tags
Tag
new
Tag
Banner Tag
Tag
Engagement Tag
Tag
Analytics Tag
new
Tag
Securiity Tag
new
Tag
Grow Tag
new

Elements
Cards

Card
Photo of Stephanie Mardell

Heading

This is some text inside of a div block.
Photo of Stephanie Mardell

Heading

This is some text inside of a div block.
Photo of Stephanie Mardell

Heading

This is some text inside of a div block.

Elements
Banners

Banner

99%

Overall customer satisfaction rating on G2
Icons representing G2 Awards won by Lattice

Elements
Charts

Chart — Progress bar
Statistic
91%
Statistic
95%
Statistic
94%
Statistic
91%
Statistic
96%
Statistic
94%
Chart — Progress circle
84%
54%
46%
Chart — Checklist
  • Item 1
  • Item 2
  • Item 3

Elements
Tabs

Basic tabs
Quote tabs

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sit amet ultricies felis. Sed finibus mollis metus, ut sodales ligula bibendum ac. Nunc ornare magna id libero venenatis, ac auctor elit accumsan. Nunc facilisis justo mi, vitae condimentum massa imperdiet ac.

Name 1 —  Info 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sit amet ultricies felis. Sed finibus mollis metus, ut sodales ligula bibendum ac. Nunc ornare magna id libero venenatis, ac auctor elit accumsan. Nunc facilisis justo mi, vitae condimentum massa imperdiet ac.

Name 2 —  Info 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sit amet ultricies felis. Sed finibus mollis metus, ut sodales ligula bibendum ac. Nunc ornare magna id libero venenatis, ac auctor elit accumsan. Nunc facilisis justo mi, vitae condimentum massa imperdiet ac.

Name 3 —  Info 3
Vertical tabs

Layouts
Grids

Grid 1 col
Grid 1 Col
Grid 1 Col
Grid 1 Col
Grid 1 Col Big
Grid 1 Col
Grid 1 Col Big
Grid 1 Col
Grid 1 Col Small
Grid 1 Col
Grid 1 Col Small
Grid 2 col
Grid 2 Col
Grid 2 Col
Grid 2 Col
Grid 2 Col Big
Grid 2 Col
Grid 2 Col Big
Grid 2 Col
Grid 2 Col Small
Grid 2 Col
Grid 2 Col Small
Grid 2 Col
1/3 - 2/3
Grid 2 Col
1/3 - 2/3
Grid 2 Col
2/3 - 1/3
Grid 2 Col
2/3 - 1/3
Grid 3 col
Grid 3 Col
Grid 3 Col
Grid 3 Col
Grid 4 col
Grid 4 Col
Grid 4 Col
Grid 4 Col
Grid 4 Col
Grid 5 col
Grid 5 Col
Grid 5 Col
Grid 5 Col
Grid 5 Col
Grid 5 Col
Grid 5 col
Grid 6 Col
Grid 6 Col
Grid 6 Col
Grid 6 Col
Grid 6 Col
Grid 6 Col

Layouts
Flex

display Flex
Horizontal
Top
Left
Horizontal
Top
Middle
Horizontal
Top
Right
Horizontal
Top
Space
Vertical
Top
Left
Vertical
Top
Middle
Vertical
Top
Right
Vertical
Top
Stretch
Vertical
Center
Left
Vertical
Center
Middle
Vertical
Center
Right
Horizontal
Center
Middle

Layouts
Images

Image Fit
Image Fit Cover
Photo of Stephanie Mardell
Image Fit Contain
Photo of Stephanie Mardell
Image ratios - Portrait
Image Ratio Wrapper
Image Ratio 1:1 ⏹
Photo of Stephanie Mardell
Image Ratio Wrapper
Image Ratio 5:4 ↔️
Photo of Stephanie Mardell
Image Ratio Wrapper
Image Ratio 4:3 ↔️
Photo of Stephanie Mardell
Image Ratio Wrapper
Image Ratio 3:2 ↔️
Photo of Stephanie Mardell
Image Ratio Wrapper
Image Ratio 16:9 ↔️
Photo of Stephanie Mardell
Image ratios - Landscape
Image Ratio Wrapper
Image Ratio 1:1 ⏹
Photo of Stephanie Mardell
Image Ratio Wrapper
Image Ratio 4:5 ↕️
Photo of Stephanie Mardell
Image Ratio Wrapper
Image Ratio 3:4 ↕️
Photo of Stephanie Mardell
Image Ratio Wrapper
Image Ratio 2:3 ↕️
Photo of Stephanie Mardell
Image Ratio Wrapper
Image Ratio 9:16 ↕️
Photo of Stephanie Mardell
Image positions
Image Position 0%
Photo of Stephanie Mardell
Image Position 10%
Photo of Stephanie Mardell
Image Position 20%
Photo of Stephanie Mardell
Image Position 30%
Photo of Stephanie Mardell
Image Position 40%
Photo of Stephanie Mardell
Image Position 50%
Photo of Stephanie Mardell
Image Position 60%
Photo of Stephanie Mardell
Image Position 70%
Photo of Stephanie Mardell
Image Position 80%
Photo of Stephanie Mardell
Image Position 90%
Photo of Stephanie Mardell

Layouts
Spacing

Dividers
Divider
Divider Tiny
Divider
Divider Small
Divider
Divider Medium
Divider
Divider Big
Sections spacing
Section
Section Tiny
Section
Section Small
Section (default)
Section
Section Big

Layouts
Margins

Margin auto
Margin Auto
Margins top & bottom
Margin Bottom 0px
Margin Bottom 4px
Margin Bottom 8px
Margin Bottom 16px
Margin Bottom 24px
Margin Bottom 32px
Margin Bottom 48px
Margin Bottom 64px
Margin Top 0px
Margin Top 4px
Margin Top 8px
Margin Top 16px
Margin Top 24px
Margin Top 32px
Margin Top 48px
Margin Top 64px
Margin Ends 0px
Margin Ends 4px
Margin Ends 8px
Margin Ends 16px
Margin Ends 24px
Margin Ends 32px
Margin Ends 48px
Margin Ends 64px
Margins left & right
Margin Right 0px
Margin Right 4px
Margin Right 8px
Margin Right 16px
Margin Right 24px
Margin Right 32px
Margin Right 48px
Margin Right 64px
Margin Left 0px
Margin Left 4px
Margin Left 8px
Margin Left 16px
Margin Left 24px
Margin Left 32px
Margin Left 48px
Margin Left 64px
Margin Sides 0px
Margin Sides 4px
Margin Sides 8px
Margin Sides 16px
Margin Sides 24px
Margin Sides 32px
Margin Sides 48px
Margin Sides 64px
Margins all
Margin All 0px
Margin All 4px
Margin All 8px
Margin All 16px
Margin All 24px
Margin All 32px
Margin All 48px
Margin All 64px

Layouts
Paddings

paddings top & bottom
Padding Bottom 0px
Padding Bottom 4px
Padding Bottom 8px
Padding Bottom 16px
Padding Bottom 24px
Padding Bottom 32px
Padding Bottom 48px
Padding Bottom 64px
Padding Top 0px
Padding Top 4px
Padding Top 8px
Padding Top 16px
Padding Top 24px
Padding Top 32px
Padding Top 48px
Padding Top 64px
Padding Ends 0px
Padding Ends 4px
Padding Ends 8px
Padding Ends 16px
Padding Ends 24px
Padding Ends 32px
Padding Ends 48px
Padding Ends 64px
paddings Left & right
Padding Right 0px
Padding Right 4px
Padding Right 8px
Padding Right 16px
Padding Right 24px
Padding Right 32px
Padding Right 48px
Padding Right 64px
Padding Left 0px
Padding Left 4px
Padding Left 8px
Padding Left 16px
Padding Left 24px
Padding Left 32px
Padding Left 48px
Padding Left 64px
Padding Sides 0px
Padding Sides 4px
Padding Sides 8px
Padding Sides 16px
Padding Sides 24px
Padding Sides 32px
Padding Sides 48px
Padding Sides 64px
paddings all
Padding All 0px
Padding All 4px
Padding All 8px
Padding All 16px
Padding All 24px
Padding All 32px
Padding All 48px
Padding All 64px

Effects
Radius

Radius 0px
Radius 4px
Radius 8px
Radius 16px
Radius 24px
Radius 48px
Radius 64px
Radius 50%

Effects
Borders

Border Left
Border Right
Border Top
Border Bottom
Border All
Border None

Effects
Shadows

Shadow Tiny
Shadow Small
Shadow Medium
Shadow Big

Form
Elements

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Form
Styles

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
By submitting your information, you agree to Lattice's Terms of Service and Privacy Policy. You can opt out anytime.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
By submitting your information, you agree to Lattice's Terms of Service and Privacy Policy. You can opt out anytime.

Form
Marketo

Marketo styles
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
→ Paste your Marketo script in this embed ←
By submitting your information, you agree to Lattice's Terms of Service and Privacy Policy. You can opt out anytime.
By submitting your information, you agree to Lattice's Terms of Service and Privacy Policy. You can opt out anytime.

Assets
Icons

Icons & Logos
Circle Logo
Circle Logo Small
Circle Logo
Circle Logo Medium
Circle Logo
Circle Logo Big
Square Logo
Square Logo Small
Square Logo
Square Logo Small
Square Logo
Square Logo Small

Assets
Glows

Glow
Glow Performance
Glow
Glow Engagement
Glow
Glow Grow
Glow
Glow Analytics

Sections
Headers

Header

Heading

Subheading paragraph

Button
Header — Video Background
Header — centered

Subheading

Heading

Subheading paragraph

Button

Sections
Headings

Heading — left

Heading

Subheading

Button
Heading — centered

Heading

Subheading

Button
Heading — centered + curve

Heading

Subheading

Button

Sections
Logos

Logos — Big client banner
Logos — G2 Banner

99%

Overall customer satisfaction rating on G2
Icons representing G2 Awards won by Lattice
Logos — Integrated Services

People Management
wherever work takes you.

Apple Store
Google Play
Gmail
Outlook
Slack
Teams
Logos — Parallax integrations

Seamless integrations with your favorite software

Getting started is easy and workflows are integrated with where your employees are already working.

Explore integrations

Sections
2 columns

2 Col — LEFT

Subheading

Heading

Subheading paragraph

Link
2 Col — RIGHT

Subheading

Heading

Subheading paragraph

Link
2 Col — Vertical Tabs
2 Col — Vertical Tabs Full

Sections
3 columns

3 ColUmns
Subheading

Heading

Subheading paragraph

  • Item 1
  • Item 2
  • Item 3
Link
Subheading

Heading

Subheading paragraph

  • Item 1
  • Item 2
  • Item 3
Link
Subheading

Heading

Subheading paragraph

  • Item 1
  • Item 2
  • Item 3
Link

Sections
4 columns

4 Columns
Subheading

Heading

Subheading paragraph

  • Item 1
  • Item 2
  • Item 3
Link
Subheading

Heading

Subheading paragraph

  • Item 1
  • Item 2
  • Item 3
Link
Subheading

Heading

Subheading paragraph

  • Item 1
  • Item 2
  • Item 3
Link
Subheading

Heading

Subheading paragraph

  • Item 1
  • Item 2
  • Item 3
Link

Sections
Quotes

quotes — Gradient

“I don’t know what we would have done without Lattice Grow. There’s no way we could have managed scale without it.

Role, Company
Author
Quotes — tabs

Loved by Employees

Finally a performance management platform that just makes it easy! Easy to use, simple to understand, and does everything you need and nothing you don’t. Writing, giving, and receiving reviews are a much more streamlined and less stressful process with Lattice.

Chipper N.  —  Senior Manager, Acquisitions (SEO & Paid Media)

I like that Lattice offers a full picture of my progress and development as an employee. I can be honest about what I think about my progress, I can get feedback easily from the people I work most closely with, and I can receive public praise for a job well done!

Emily I.  —  Content Marketer

Best performance management software out there! I am now able to keep track of my goals on a week by week basis as well as have updated goals for the future. Highly recommend Lattice performance management for managers/employees alike.

David C.  —  Recruitment Coordinator
Quotes — Various quote cards
Melisa Guerbi
Director of People and Culture
With Lattice, we found the opportunity to maintain a pulse on how employees are feeling across all our locations while keeping them engaged and focused on their growth and development.”
Photo of Nicole Hopkins
We know your people are everything. That’s why 
our Customer Experience Team is committed to making sure that you feel welcomed and successful from the moment you begin with Lattice so that you can focus your time and energy on the things that matter the most - building the best workplace and culture for your people.”
Gillian Heltai —  Chief Customer Officer
Quotes — 2-COL quote
Logo of Forrester, with a tagline

The Voice of the Customer

Annual attrition decreased by 40% due to increased employee engagement and productivity, a leading research firm found.

Read the entire study
Before Lattice, engagement score was 50%; because of that, our turnover was enormous. We had a 30% or 40% turnover rate last year.

Near the end of last year and the beginning of this year, we have a much higher adoption rate for OKRs, and we’re getting a lot more engagement in 1-on-1s of people checking in with their OKRs, etc.

Our turnover rate is currently 4% and our engagement score is 72%
—  HR Business Partner, Technology
Quotes — 2-COL quote
Photo of Nicole Hopkins
Even when I've worked in progressive organizations that value career development, we never had a tool that makes it easy to facilitate development plans in line with career tracks. Lattice Grow is the missing piece to holistic talent management.”
Nicole Hopkins  —  Director of People, Webflow

Sections
Videos

Video — About lattice

Meet Lattice

Discover how People Leaders everywhere are transforming their approach to performance, engagement, and development.
Video — Theater video
Customer Story

Engagement Surveys in Lattice Give Remote Employees a Voice to Leadership at Instapage

Olivia from Instapage — 2min