Basic Styles

Colors
Typography
Shadows

UI Elements

Buttons
Pop Up
Inputs
Icons

Style Guide

Button TextButton Text

Colors

Primary

Name Color

#5E0B15

Secondary

Light Red

#90323D

Neutral

#EAF0CE

Green

#BBBE64

Sistem Colors

Name Color

Code Color

Neutral

Black

#000000

White

#ffffff

Typography

Fonts

aA
DM Sans
ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz
aA
Melodrama
ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz

Headings

All H1 Headings

All H2 Headings

All H3 Headings

All H4 Headings

All H5 Headings
All H6 Headings

Special Headings

Heading H1 Size

Font size: 96px / 6rem | Line height: 9rem - Font size: 80px / 5rem | Line height: 120%

Heading H2 Size

Font size: 96px / 6rem | Line height: 120% - Font size: 56px / 3.5rem | Line height: 120%

Heading H3 Size

Font size: 72px / 4.5rem | Line height: 120% - Font size: 40px / 2.5rem | Line height: 120%

Heading H4 Size

Font size: 48px / 3rem | Line height: 130% - Font size: 32px / 2rem | Line height: 140%

Heading H5 Size

Font size: 32px / 2rem | Line height: 140% - Font size: 24px / 1.5rem | Line height: 140%

Heading H6 Size

Font size: 20px / 1.25rem | Line height: 140% - Font size: 18px / 1.125rem | Line height: 140%

Body

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 32px / 2rem
Line height: 150% / XBold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 32px / 2rem
Line height: 150% / Semi Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 32px / 2rem
Line height: 150% / Medium

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 32px / 2rem
Line height: 150% / Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 32px / 2rem
Line height: 150% / Light

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 24px / 1.5rem
Line height: 150% / Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 24px / 1.5rem
Line height: 150% / Semi Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 24px / 1.5rem
Line height: 150% / Medium

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 24px / 1.5rem
Line height: 150% / Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 24px / 1.5rem
Line height: 150% / Light

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 20px / 1.25rem 
Line height: 150% / Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 20px / 1.25rem 
Line height: 150% / Semi Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 20px / 1.25rem 
Line height: 150% / Medium

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 20px / 1.25rem 
Line height: 150% / Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 20px / 1.25rem 
Line height: 150% / Light

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Semi Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Medium

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Light

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Semi Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Medium

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Normal

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Font size: 16px / 1rem 
Line height: 150% / Light

Rich Text

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Text Bold

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Link
  • Item A
  • Item B
  • Item C
Bullet List
  1. Item A
  2. Item B
  3. Item C
Order List
Block quote

Block Quote

Shadows

shadow-xxsmall
shadow-xsmall
shadow-small
shadow-medium
shadow-large
shadow-xlarge
shadow-xxlarge

Buttons

Buttons

Age verification

To access this content, please confirm that you are at least 18 years old.Are you of legal age?

Yes, I'm 18+
Yes, I'm 18+
No, I'm under 18
No, I'm under 18

15% Off

Unlock 15% Off Your First Order

Simply enter your email below to receive your exclusive discount and stay updated on new releases, special offers, and more.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Inputs

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Icons

icon-embed-xxsmall

icon-embed-xsmall

icon-embed-small

icon-embed-medium

icon-embed-large

icon-embed-xlarge

icon-embed-custom1