Color Palette

Primary

10%

#FFF8E9

30%

#FFD984

50%

#FFBA00

70%

#8C6612

90%

#191203

Secundary

10%

#ECECEC

30%

#979695

50%

#41403E

70%

#242322

90%

#060606

Neutral

#FFFFFF

25%

#F1F1EF

50%

#9A9A98

75%

#686764

100%

#353430

Success

10%

#EAFCEA

30%

#89F08A

50%

#29E32B

70%

#177D18

90%

#041704

Danger

10%

#FFEAE6

30%

#FF8C76

50%

#FF2D05

70%

#8C1903

90%

#190400

Warning

10%

#FFFCED

30%

#FFED9A

50%

#FFDE47

70%

#8C7A27

90%

#191607

Info

10%

#ECF9FF

30%

#99DFFF

50%

#45C4FF

70%

#266C8C

90%

#071419

Fonts - BG Light

H1 Heading » Poppins, Bold » tamanho: 48px(3rem) » linha: 56px(4rem)
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

H2 Heading » Poppins, Bold » tamanho: 40px(2.5rem) » linha: 48px(3.5rem)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero.

H3 Heading » Poppins, Bold » tamanho: 32px(2rem) » linha: 40px(3rem)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero.

H4 Heading » Poppins, Bold » tamanho: 24px(1.5rem) » linha: 32px(2.5rem)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet.

H5 Heading » Poppins, Bold » tamanho: 18px(1.125rem) » linha: 24px(2rem)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet.

H6 Heading » Poppins, Bold » tamanho: 16px(1rem) » linha: 24px(2rem)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet.

P1 Paragraph » Poppins, Medium » tamanho: 16px(1rem) » linha: 32px(2rem)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet.

P2 Label » Poppins, Medium » tamanho: 14px(0.875rem) » linha: 24px(1.5rem)

P3 Small Paragraph » Poppins, Medium » tamanho: 12px(0.75rem) » linha: 19px(1.88rem)

Fonts - BG Dark

H1 Heading » Poppins, Bold » tamanho: 48px(3rem) » linha: 56px(4rem)

H2 Heading » Poppins, Bold » tamanho: 40px(2.5rem) » linha: 48px(3.5rem)

H3 Heading » Poppins, Bold » tamanho: 32px(2rem) » linha: 40px(3rem)

H4 Heading » Poppins, Bold » tamanho: 24px(1.5rem) » linha: 32px(2.5rem)

H5 Heading » Poppins, Bold » tamanho: 18px(1.125rem) » linha: 24px(2rem)

H6 Heading » Poppins, Bold » tamanho: 16px(1rem) » linha: 24px(2rem)

P1 Paragraph » Poppins, Medium » tamanho: 16px(1rem) » linha: 32px(2rem)

P2 Label » Poppins, Medium » tamanho: 14px(0.875rem) » linha: 24px(1.5rem)

P3 Small Paragraph » Poppins, Medium » tamanho: 12px(0.75rem) » linha: 19px(1.88rem)

Buttons - BG Light

Buttons - BG Dark

Badges

Forms

H1 Heading » Poppins, Bold » tamanho: 48px(3rem) » linha: 56px(4rem)Lorem ipsum dolor sit amet, consectetur adipiscing elit.

H2 Heading » Poppins, Bold » tamanho: 40px(2.5rem) » linha: 48px(3.5rem)Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero.

H3 Heading » Poppins, Bold » tamanho: 32px(2rem) » linha: 40px(3rem)Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero.

H4 Heading » Poppins, Bold » tamanho: 24px(1.5rem) » linha: 32px(2.5rem)Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque justo diam, tempus vel velit a, efficitur semper libero. Suspendisse rutrum fringilla mi, eget dignissim augue ornare sit amet.