logo

Design System

01 Colors

Main Accent

  • HEX / RGB / HSL:
  • #FFC593, rgb(255, 197, 147), 28°, 100%, 79%
  • #BC7198, rgb(188, 113, 152), 329°, 36%, 59%
  • #5A77FF, rgb(90, 119, 255) 229°, 100%, 67%

Pure Black

  • HEX : #000000
  • RGB : rgb(0, 0, 0)
  • HSL : hsl(0°, 0%, 0%)

Light Grey

  • HEX : #DFDFDF
  • RGB : rgb(223, 223, 223)
  • HSL : hsl(0°, 0%, 87%)

White

  • HEX : #FFFFFF
  • RGB :rgb(255, 255, 255)
  • HSL : hsl(0°, 0%, 100%)

02 Typography

Font Family

DM Sans

a b c d e f g h i j k l m n o p q r s t u v w x y z a b c d e f g h i j k l m n o p q r s t u v w x y z !@#$%^&*()

Font Family

H1/H2 (large); 40px; 48px line; 4.17 Character

DM SANS BOLD

H2; 24px; 25px line; 0 Character

DM SANS BOLD

H3; 18px; 25px line; 0 Character

DM SANS BOLD

H4; 12px; 16px line; 2 Character

DM SANS BOLD

Body

Body; DM Sans Regular; 15px; 25px line; 0 Character

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti.Sed egestas, ante et vulputate volutpat, eros pede semper est, vitae luctus metus libero eu augue. Morbi purus libero, faucibus adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis, mi neque euismod dui, eu pulvinar nun.

03 Button

ButtonPrimary
ButtonSecondary