These components are used throughout Neat's websites and can also be reused to build sections/patterns.

Global Classes

Flex Horizontal Center Top
Flex Horizontal Center Top
Flex Vertical Left Top
Flex Vertical Center Top
Relative

Colors

BG White
Font White
Font Black
Font Dimmed
Font Dimmed

Box Shadow

Spacing

Margin Bottom 0vw
Margin Bottom 1vw
Margin Bottom 2vw
Margin Bottom 3vw
Margin Bottom 4vw
Margin Bottom 5vw
Margin Bottom 6vw
Margin Bottom 7vw
Margin Bottom 8vw
Margin Bottom 9vw
Margin Bottom 10vw
Margin Top 1vw
Margin Top 1vw
Margin Top 2vw
Margin Top 3vw
Margin Top 4vw
Margin Top 5vw
Margin Top 6vw
Margin Top 7vw
Margin Top 8vw
Margin Top 9vw
Margin Top 10vw
Padding Bottom 0vw
Padding Bottom 1vw
Padding Bottom 2vw
Padding Bottom 3vw
Padding Bottom 4vw
Padding Bottom 5vw
Padding Bottom 6vw
Padding Bottom 7vw
Padding Bottom 8vw
Padding Bottom 9vw
Padding Bottom 10vw
Padding Bottom 12vw
Padding Bottom 14vw
Padding Top 0vw
Padding Top 1vw
Padding Top 2vw
Padding Top 3vw
Padding Top 4vw
Padding Top 5vw
Padding Top 6vw
Padding Top 7vw
Padding Top 8vw
Padding Top 9vw
Padding Top 10vw
Padding Top 12vw
Padding Top 14vw
Padding Top 16vw
Padding Top 17vw
Padding Top 18vw
Padding Top 20vw

Alignment

Align Left
Align Center
Align Right
Align Justify

Width (vw)

W30
W40
W50
W60
W70
W80
W90
W100 (full screen)

Height (vh)

Height 100 (full screen)

Buttons

Primary 1
Get Pre-Approved
Primary 2
Get Pre-Approved 
Secondary 1
Get Pre-Approved
Secondary 2
Get Pre-Approved 
Text Only 1
Get Pre-Approved
Text Only 2
Get Pre-Approved 
Icon 1
Get Pre-Approved
Icon 2
My Home's Value
Icon 3
My Home's Value

Hero Section Default

Components

All the components that are used in Neat's marketing sites can be found below.