Styleguide

  • Black #000000
  • SW Neon Yellow #E3FC52
  • OPM Pink #FF3DCA
  • Atomic Saloon Yellow #FFF90A
  • Absinthe Green #03FA66
  • The Hook Teal #78FFFF
  • Disco Show Blurple #8E7BFF
  • White #FFFFFF
SW Neon Yellow
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
OPM Pink
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
fail
Atomic Saloon Yellow
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
Absinthe Green
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
The Hook Teal
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
Disco Show Blurple
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
fail
White
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
Black
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
Black
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
fail
White
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
fail
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
fail
WCAG AAA
fail
Black
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
Black
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
Black
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
Black
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
fail
White
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
fail
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
fail
WCAG AAA
fail
Black
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
pass
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
pass
WCAG AAA
pass
OPM Pink
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
fail
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
fail
WCAG AAA
fail
Disco Show Blurple
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

WCAG AA
pass
WCAG AAA
fail
Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.

WCAG AA
fail
WCAG AAA
fail
Lorem ipsum dolor sit amet
hero
Font size 130px Line height 130px
Font size 50px Line height 50px
Lorem ipsum dolor sit amet
h1
Font size 100px Line height 100px
Font size 50px Line height 50px
Lorem ipsum dolor sit amet
h2
Font size 80px Line height 80px
Font size 40px Line height 39px
Lorem ipsum dolor sit amet
h3
Font size 60px Line height 60px
Font size 35px Line height 34px
Lorem ipsum dolor sit amet
h4
Font size 50px Line height 50px
Font size 30px Line height 29px
Lorem ipsum dolor sit amet
h5
Font size 42px Line height 42px
Font size 28px Line height 27px
Lorem ipsum dolor sit amet
h6
Font size 34px Line height 34px
Font size 24px Line height 23px
Lorem ipsum dolor sit amet
subhead
Font size 24px Line height 24px
Font size 18px Line height 18px
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Neque enim civitas in seditione beata esse potest nec in discordia dominorum domus; Expectoque quid ad id, quod quaerebam, respondeas.
p
Font size 18px Line height 25px
Font size 16px Line height 22px
Lorem ipsum dolor sit amet
xs
Font size 16px Line height 20px
Font size 14px Line height 16px
Lorem ipsum dolor sit amet
large-button
Font size 28px Line height 28px
Font size 20px Line height 18px
Lorem ipsum dolor sit amet
button
Font size 14px Line height 14px Tracking 1.25px
Font size 14px Line height 14px Tracking 1.25px
Lorem ipsum dolor sit amet
nav
Font size 30px Line height 30px
Font size 25px Line height 25px
Lorem ipsum dolor sit amet
side-nav
Font size 25px Line height 25px
Font size 20px Line height 19px
Lorem ipsum dolor sit amet
sub-nav
Font size 20px Line height 20px
Font size 20px Line height 20px
Lorem ipsum dolor sit amet
page-numbers
Font size 22px Line height 24px
Font size 20px Line height 20px
Lorem ipsum dolor sit amet
show-nav
Font size 18px Line height 18px
Font size 18px Line height 18px
Lorem ipsum dolor sit amet
legal
Font size 14px Line height 21px
Font size 14px Line height 21px
Lorem ipsum dolor sit amet
tag
Font size 12px Line height 18px Tracking 0.6px
Font size 12px Line height 18px Tracking 0.6px
120px
Anton
120px
Interstate
120px
Interstate Condensed