Colors
Background / Container
Background
bg-bg
#FFF9F1
Light
bg-container-light
#FFF9F1
Default
bg-container
#f4f4f4
Dark
bg-container-dark
#F1E7DB
Primary
Light
bg-primary-lighter
#fce5cc
Light
bg-primary-light
#ffd0a8
Default
bg-primary
#EF7D00
Dark
bg-primary-dark
#c46800
Secondary
Lighter
bg-secondary-lighter
#CCDFD9
Light
bg-secondary-light
#2a7a60
Default
bg-secondary
#00533D
Dark
bg-secondary-dark
#003829
Type
Light
bg-type-light
#7f7f7f
Default
bg-type
#1D1D1B
Dark
bg-type-dark
#000000
Extra — Regio
Azië — Donker
bg-extra-red-dark
#6B1020
Azië — Licht
bg-extra-red
#D4251A
Zuid-Azië — Donker
bg-extra-purple-dark
#6633CC
Zuid-Azië — Licht
bg-extra-purple
#9999FF
Afrika — Donker
bg-extra-yellow-dark
#8B7A00
Afrika — Licht
bg-extra-yellow
#B5A020
Lime — Donker
bg-extra-lime-dark
#A9AD4D
Lime — Licht
bg-extra-lime
#D5D87E
Green — Donker
bg-extra-green-dark
#00533D
Green — Licht
bg-extra-green
#148264
Subtle
Lighter
bg-subtle-lighter
#FFF9F1
Light
bg-subtle-light
#FEF1E4
Default
bg-subtle
#F8F0E6
Default
bg-subtle-dark
#F1E7DB
Dark
bg-subtle-darker
#D9CFC4
Muted
Light
bg-muted-lighter
#f4f4f4
Light
bg-muted-light
#eaeaea
Default
bg-muted
#9f9f9f
Dark
bg-muted-dark
#7f7f7f
Error
Light
bg-error-light
#FEF1F0
Default
bg-error
#F9141C
Notice
Light
bg-notice-light
#e9f6f9
Default
bg-notice
#0c5998
Warning
Light
bg-warning-light
#FEF1E4
Default
bg-warning
#EF7D00
Success
Light
bg-success-light
#EEF9EE
Default
bg-success
#00533D
Type / Foreground
Text type light
text-type-light
#7f7f7f
Text type default
text-type
#1D1D1B
Text type dark
text-type-dark
#000000
Text primary
text-primary
#EF7D00
Text secondary
text-secondary
#00533D
Text on-primary
text-on-primary
#fff
Text on-secondary
text-on-secondary
#fff
Logo
Home of
authentic flavours
Placeholder images
Typography
Montserrat — variable font (300–700)
Montserrat light (300)
Montserrat regular (400)
Montserrat medium (500)
Montserrat semibold (600)
Montserrat bold (700)
Tiempos Headline — bold only (700)
Tiempos Headline bold (700)
H1–H6 gebruiken font-serif by default
H1 — 30px / desktop 60px
H2 — 30px / desktop 48px
H3 — 24px / desktop 30px
H4 — 28px / desktop 24px
H5 — 18px / desktop 20px
H6 — 16px / desktop 18px
Custom text sizes
text-huge — 70px
text-bigger — 60px
text-big — 40px
text-larger — 34px
text-large — 30px
H2 — This is a content heading
H3 — This is a content heading
H4 — This is a content heading
H5 — This is a content heading
H6 — This is a content heading
font-light (300)
text-xs
text-sm
text-base
text-lg
text-xl
font-normal (400)
text-xs
text-sm
text-base
text-lg
text-xl
font-medium (500)
text-xs
text-sm
text-base
text-lg
text-xl
font-semibold (600)
text-xs
text-sm
text-base
text-lg
text-xl
font-bold (700)
text-xs
text-sm
text-base
text-lg
text-xl
serif font-bold (700)
text-xs
text-sm
text-base
text-lg
text-xl
Tracking
tracking-wide — .2px
tracking-wider — .27px
Paragraph text. Sometimes we lose sight of what really matters in life. There's something to be said for a gourmet brie and truffle burger paired with parmesan frites, but don't let that make you forget about the ol' faithful with American cheddar and a squishy bun. Lettuce remind you that cheeseburgers come in all forms - bun intended.
Epic cheeseburgers come in all kinds of manifestations, but we want them in and around our mouth no matter what. Slide those smashed patties with the gently caramelized meat fat between a toasted brioche bun and pass it over. You fall in love with the cheeseburger itself but the journey ain't half bad either.
Definition list
- Cheeseburger
- The last time you had a cheeseburger was too long ago.
- Tasty
- A cheeseburger is more than just a sandwich, it is a wish fulfilled.
- Drooling
- Why are you still reading this- go get a cheeseburger.
Unordered list
- List item with a much longer description or more content.
- List item
- List item
- Nested List Item
- Nested List Item
- Nested List Item
- List item
Ordered list
- List Item 1
- List Item 2
- List Item 3
Blockquote
The palatable sensation we lovingly refer to as The Cheeseburger has a distinguished and illustrious history. It was born from humble roots, only to rise to well-seasoned greatness. Cheesy Mc Cheeseface
Custom spacing
xs — 5px
sm — 10px
md — 15px
lg — 25px