Colors

Background Colors

blue -
.bg--blue
dark -
.bg--dark
light -
.bg--light
primary -
.bg--primary
secondary -
.bg--secondary
tertiary -
.bg--tertiary
primary -
.bg--primary
secondary -
.bg--secondary
tertiary -
.bg--tertiary
primary -
.border.border--primary
secondary -
.border.border--secondary
primary -
.border.border--primary
secondary -
.border.border--secondary

Text Colors

.text-color-primary

.text-color-secondary

.text-color-tertiary

.text-color-quaternary

.text-color-white

.text-color-gradient

.text-color-primary

.text-color-secondary

.text-color-tertiary

.text-color-quaternary

.text-color-white

.text-color-gradient

Typography

Text styles

Headings

56px - h1 or .h1 or .display-xl

44px - h2 or .h2 or .display-lg

36px - h3 or .h3 or .display-md

32px - h4 or .h4 or .display-sm

24px - h5 or .h5 or .display-xs

Text sizes

20px - .text-xl

18px - .text-lg

16px - .text-md

14px - .text-sm

12px - .text-xs

Fonts

.font--primary

Font weight

.fw-light

.fw-normal

.fw-medium

.fw-semibold

.fw-bold

.fw-bolder

.content-block

Title

Subtitle

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi obcaecati iure odit, esse optio culpa, sunt illum ad quos aliquam veritatis, nulla fugit tempore! Ipsa blanditiis officia ducimus accusantium similique.

  • Lorem ipsum 1
  • Lorem ipsum 2
  • Lorem ipsum 3
  • Lorem ipsum 4
  • Lorem ipsum 5

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi obcaecati iure odit, esse optio culpa, sunt illum ad quos aliquam veritatis, nulla fugit tempore! Ipsa blanditiis officia ducimus accusantium similique.

  1. Lorem ipsum 1
  2. Lorem ipsum 2
  3. Lorem ipsum 3
  4. Lorem ipsum 4
  5. Lorem ipsum 5

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi obcaecati iure odit, esse optio culpa, sunt illum ad quos aliquam veritatis, nulla fugit tempore! Ipsa blanditiis officia ducimus accusantium similique.

Check list - .check-list

  • Lorem ipsum 1
  • Lorem ipsum 2
  • Lorem ipsum 3
  • Lorem ipsum 4
  • Lorem ipsum 5
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi obcaecati iure odit, esse optio culpa, sunt illum ad quos aliquam veritatis, nulla fugit tempore! Ipsa blanditiis officia ducimus accusantium similique.

Buttons

.button.button-primary
Button
.button.button-secondary
Button
.button.button-tertiary
Button
.button.button-primary.button-arrow
Button
.button.button-secondary.button-arrow
Button
.button.button-tertiary.button-arrow
Button
.button.button-primary
Button SM
.button.button-secondary
Button SM
.button.button-secondary-light
Button
.button.button-secondary-light.button-arrow
Button

.text-button-arrow

Read article

.text-button-arrow-back

Back to resources

.link-underline

Text link

Components

.component--tag

data-style=[grey]
data-style=[yellow]
data-style=[green]
data-style=[purple]
data-style=[blue]
data-style=[pink]
data-style=[orange]
data-style=[gradient]
data-style=[red]

Form

Error: Contact form not found.

Error: Contact form not found.

4.7

Let’s get started on something great.

We’re glad you are here! Densify customizes your experience by enabling cookies that help us understand your interests and recommend related information. By using our sites, you consent to our use of cookies. Learn more.