Colors

Base Colors

Base/White

#FFFFFF

Base/Black

#121212

Neutral

Neutral/50

#FCFCFD

Neutral/100

#F2F4F7

Neutral/200

#EAECF0

Neutral/300

#D0D5DD

Neutral/400

#98A2B3

Neutral/500

#667085

Neutral/600

#475467

Neutral/700

#344054

Neutral/800

#182230

Neutral/900

#101828

Neutral/950

#0C111D

Brand

Primary

Brand/Primary/50

#D2E2DB

Brand/Primary/100

#B3CFC3

Brand/Primary/200

#8DB6A5

Brand/Primary/300

#689E87

Brand/Primary/400

#428669

Brand/Primary/500

#1C6E4B

Brand/Primary/600

#175C3F

Brand/Primary/700

#134932

Brand/Primary/800

#0E3726

Brand/Primary/900

#092519

Brand/Primary/950

#061911

Secondary

Brand/Secondary/50

#F0F4EB

Brand/Secondary/100

#E6EDDD

Brand/Secondary/200

#CEDBBC

Brand/Secondary/300

#CEDBBC

Brand/Secondary/400

#C1D2AB

Brand/Secondary/500

#B5C99A

Brand/Secondary/600

#97A780

Brand/Secondary/700

#798667

Brand/Secondary/800

#3C4333

Brand/Secondary/900

#24281F

Brand/Secondary/950

#171A14

Tertiary

Brand/Tertiary/50

#E4FCF7

Brand/Tertiary/100

#CDF9F1

Brand/Tertiary/200

#96F3E2

Brand/Tertiary/300

#64EDD4

Brand/Tertiary/400

#31E7C6

Brand/Tertiary/500

#17C7A7

Brand/Tertiary/600

#12A086

Brand/Tertiary/700

#0E7764

Brand/Tertiary/800

#094E41

Brand/Tertiary/900

#052923

Brand/Tertiary/950

#02120F

Quaternary

Brand/Quaternary/50

#FBECFE

Brand/Quaternary/100

#F6D9FC

Brand/Quaternary/200

#EEB3F9

Brand/Quaternary/300

#E58DF6

Brand/Quaternary/400

#DC67F4

Brand/Quaternary/500

#D444F1

Brand/Quaternary/600

#C011E4

Brand/Quaternary/700

#900DAB

Brand/Quaternary/800

#600972

Brand/Quaternary/900

#300439

Brand/Quaternary/950

#18021C

Semantic

Positive

Semantic/Positive/50

#DBFFE5

Semantic/Positive/100

#B3FFC7

Semantic/Positive/200

#6BFF93

Semantic/Positive/300

#1FFF5B

Semantic/Positive/400

#00D639

Semantic/Positive/500

#008A25

Semantic/Positive/600

#00701E

Semantic/Positive/700

#005216

Semantic/Positive/800

#00380F

Semantic/Positive/900

#001A07

Semantic/Positive/950

#000F04

Warning

Semantic/Warning/50

#FFF9E5

Semantic/Warning/100

#FFF2CC

Semantic/Warning/200

#FFE599

Semantic/Warning/300

#FFD966

Semantic/Warning/400

#FFCC33

Semantic/Warning/500

#FFBF00

Semantic/Warning/600

#CC9900

Semantic/Warning/700

#997300

Semantic/Warning/800

#664C00

Semantic/Warning/900

#332600

Semantic/Warning/950

#1A1300

Negative

Semantic/negative/50

#FBE9E9

Semantic/negative/100

#F8D3D3

Semantic/negative/200

#EFA4A4

Semantic/negative/300

#E87878

Semantic/negative/400

#E04848

Semantic/negative/500

#D12424

Semantic/negative/600

#A51C1C

Semantic/negative/700

#7E1616

Semantic/negative/800

#530E0E

Semantic/negative/900

#2C0707

Semantic/negative/950

#160404

Info

Semantic/info/50

#E0F0FF

Semantic/info/100

#C7E4FF

Semantic/info/200

#8FC9FF

Semantic/info/300

#52ABFF

Semantic/info/400

#1A90FF

Semantic/info/500

#0074E0

Semantic/info/600

#005CB3

Semantic/info/700

#004585

Semantic/info/800

#600972

Semantic/info/900

#00182E

Semantic/info/950

#000B14

Alpha

White

Alpha/white/50

#FFFFFF @ 5%

Alpha/white/100

#FFFFFF @ 10%

Alpha/white/200

#FFFFFF @ 20%

Alpha/white/300

#FFFFFF @ 30%

Alpha/white/400

#FFFFFF @ 40%

Alpha/white/500

#FFFFFF @ 50%

Alpha/white/600

#FFFFFF @ 60%

Alpha/white/700

#FFFFFF @ 70%

Alpha/white/800

#FFFFFF @ 80%

Alpha/white/900

#FFFFFF @ 90%

Alpha/white/950

#FFFFFF @ 95%

Black

Alpha/black/50

#121212 @ 5%

Alpha/black/100

#121212 @ 10%

Alpha/black/200

#121212 @ 20%

Alpha/black/300

#121212 @ 30%

Alpha/black/400

#121212 @ 40%

Alpha/black/500

#121212 @ 50%

Alpha/black/600

#121212 @ 60%

Alpha/black/700

#121212 @ 70%

Alpha/black/800

#121212 @ 80%

Alpha/black/900

#121212 @ 90%

Alpha/black/950

#121212 @ 95%

Primary

Alpha/primary/50

#7A38DD @ 10%

Alpha/primary/100

#7A38DD @ 10%

Alpha/primary/200

#7A38DD @ 20%

Alpha/primary/300

#7A38DD @ 30%

Alpha/primary/400

#7A38DD @ 40%

Alpha/primary/500

#7A38DD @ 50%

Alpha/primary/600

#7A38DD @ 60%

Alpha/primary/700

#7A38DD @ 70%

Alpha/primary/800

#7A38DD @ 80%

Alpha/primary900

#7A38DD @ 90%

Alpha/primary/950

#7A38DD @ 95%

Typography

Poppins

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Kk Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

regular

medium

semibold

bold

Download Font

Text styles

Size

Line height

Display-lg

7rem

110%

Display-Md

6rem

110%

Display-Sm

5rem

110%

Heading-H1

H1

4rem

110%

Heading-H2

H2

3.5rem

120%

Heading-H3

H3

3rem

120%

Heading-H4

H4

2.5rem

120%

Heading-H5

H5

2rem

130%

Heading-H6

H6

1.5rem

130%

Caption

0.75rem

155%

Text Sizes

Size

Line height

text-size-lg

1.75rem

150%

text-size-xl

1.5rem

150%

text-size-lg

1.25rem

150%

text-size-md

1rem

150%

text-size-sm

0.875rem

155%

text-size-xs

0.75rem

155%

Text Weights

text-weight-regular

text-weight-medium

text-weight-semibold

text-weight-bold

Text Styles

text-style-allcaps

text-style-italic

text-style-nowrap

text-style-muted

text-style-strikethrough

text-style-allcaps

text-style-link

Sample text is being used as a placeholder.

Text Alignments

text-align-left

text-align-center

text-align-right

Text Colors

text-color-primary

text-color-secondary

text-color-teritiary

text-color-disable

text-color-primary-inverse

text-color-secondary-inverse

text-color-tertiary-inverse

text-color-positive

text-color-negative

text-color-warning

text-color-info

Rich Text

Heading 1

Buying a home for the first time is an exciting milestone, but it can also be a daunting process filled with uncertainty. The real estate market can be complex, and first-time buyers often face challenges they didn't anticipate. To help you navigate the market and make informed decisions, we’ve compiled a list of essential tips.

Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.

Heading 2

Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.

Buying a home for the first time is an exciting milestone, but it can also be a daunting process filled with uncertainty. The real estate market can be complex, and first-time buyers often face challenges they didn't anticipate. To help you navigate the market and make informed decisions, we’ve compiled a list of essential tips.

‍

Blog V3 Hero Image 03 - Hudson Flynn O - A Scaleable Real Estate Webflow Template

Heading 3

Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.

Heading 4

Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.

Heading 5

Heading 6

Other HTML Tags

All paragraphs

Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text.

All links

Text Link

All quotes

Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website.

All Ordered Lists

Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.

All Ordered Lists

Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.
Buying a home for the first time is an exciting milestone.

Structure

page-wrapper

main-wrapper

container-extra-sm

container-small

container-medium

container-large

button-group

Max Width

max-width-full

max-width-full-tablet

max-width-full-mobile-portrait

max-width-full-mobile-landscape

max-width-2xl

max-width-xl

max-width-lg

max-width-md

max-width-sm

max-width-xs

Elevations

Shadows

shadow-xs

shadow-sm

shadow-md

shadow-lg

shadow-xl

shadow-2xl

shadow-3xl

BG blur

BG-blur 3xl

BG-blur sm

BG-blur md

BG-blur lg

BG-blur xl

BG-blur 2xl

BG-blur 3xl

Useful utility systems

hide

This element is hidden

hide-tablet

hide-mobile-portrait

hide-mobile-landscape

overflow-visible

overflow-hidden

overflow-auto

overflow-scroll

pointer-events-auto

pointer-events-none

spacing-clean

align-center

Animations

⏫ Slide to top

0.2s

0.3s

0.4s

0.5s

0.6s

0.7s

0.8s

0.9s

1.2s

1.4s

1.6s

⏪ Slide To Left

0.2s

0.3s

0.4s

0.5s

0.6s

0.7s

0.8s

0.9s

1.2s

1.4s

1.6s

⏩ Slide To Right

0.2s

0.3s

0.4s

0.5s

0.6s

0.7s

0.8s

0.9s

1.2s

1.4s

1.6s

🔍 Zoom In

0.2s

0.3s

0.4s

0.5s

0.6s

0.7s

0.8s

0.9s

1.2s

1.4s

1.6s

👻 Fade In

0.2s

0.3s

0.4s

0.5s

0.6s

0.7s

0.8s

0.9s

1.2s

1.4s

1.6s