Typography

The default font for texts in Neptune CSS is Open Sans. Poppins is the font for headlines.

Headlines

You can use the h1...h6 tags or the .headline-1 ... .headline-6 classes to make a headline with Neptune CSS.

Class	Font size	Font weight	Line height
.headline-1	56px	900	72px
.headline-2	40px	800	56px
.headline-3	28px	800	40px
.headline-4	26px	700	32px
.headline-5	22px	700	32px
.headline-6	20px	600	28px

Headline example

Sizes

There are 3 different sizes for <p>, <a> and <span> tags: .text-s, .text-m, .text-l

Class	Font size	Font weight	Line height
.text-s	12px	400	16px
.text-m	14px	400	20px
.text-l	16px	400	27px

Text size example

Align

Text Align Classes
.text-start
.text.left
.text-center
.text-justify
.text-right
.text-end

Text align example

Styles

Text Style Classes
.cursive
.dashed-line
.dotted-line
.double-line
.line-through
.overlined
.underlined
.wavy-line

Text style example

Highlighting

Text Class	Color Variable
.highlighted-primary	var(--highlight-primary)
.highlighted-accent	var(--highlight-acent)
.highlighted-secondary	var(--highlight-secondary)

Text highlighting example