Foundation

Trepup's design principles are the building blocks of our pages. Our principles are specific, actionable and nuanced, and help to visually enhance the user experience.

Uniform border radius

Card (300 pixels or less)

Border radius is 5 pixels when the card width is 300 pixels or less

Card (301 pixels or more)

Border radius is 10 pixels when the card width is 301 pixels or more

Text box

Border radius is 2 pixels for text boxes of all widths

Button

Button corners have a rounded radius of 50% for all button widths

Space inside the card

White space is used within cards to create a simple and elegant design and make our content easy to understand.

Mobile (320 pixels)

All four paddings are 10 pixels

Web & mobile (321 pixels or more)

All four paddings are 20 pixels

Space outside the card

White space is used to separate each card from other design elements to improve the visual communication.

Mobile (320 to 720 pixels)

Top and bottom margins are 10 pixels

Web (721 pixels or more)

All four margins are 10 pixels

Join us and get started. Log in Sign up Free