Brand and Design Guide

Please use our design guide for blog post, social media post, etc.

Logos

Use Roboto BOLD font for Hipcall Logo's text.

Hipcall logo without text

Hipcall logo text

Hipcall logo without text dark background

Fonts

Use Roboto font

Colours

Primary

  • primary-50 - HEX: #D8E4EE
  • primary-100 - HEX: #B3CADF
  • primary-200 - HEX: #80A7CA
  • primary-300 - HEX: #4e7dc7
  • primary-400 - HEX: #3574AB
  • primary-500 - HEX: #1B62A0
  • primary-600 - HEX: #025196
  • primary-700 - HEX: #024988
  • primary-900 - HEX: #02315A

Secondary

  • secondary-50 - HEX: #FEEAC9
  • secondary-100 - HEX: #FDE2B6
  • secondary-200 - HEX: #FDDCA5
  • secondary-300 - HEX: #FDD694
  • secondary-400 - HEX: #FDCF82
  • secondary-500 - HEX: #FDC870
  • secondary-600 - HEX: #FCBA4C
  • secondary-900 - HEX: #402902

Danger

  • danger-50 - HEX: #F5DEDF
  • danger-100 - HEX: #EABEC0
  • danger-200 - HEX: #DC9295
  • danger-300 - HEX: #CE666B
  • danger-400 - HEX: #C75055
  • danger-500 - HEX: #C03A40
  • danger-600 - HEX: #B9242B
  • danger-900 - HEX: #8D1C21

Warning

  • warning-10 - HEX: #FEF4E3
  • warning-50 - HEX: #FDEDD9
  • warning-100 - HEX: #FBDBB3
  • warning-200 - HEX: #F8C380
  • warning-300 - HEX: #F5AB4D
  • warning-400 - HEX: #F39F33
  • warning-500 - HEX: #F19319
  • warning-600 - HEX: #F08700
  • warning-900 - HEX: #704000

Success

  • success-10 - HEX: #EBF1E5
  • success-50 - HEX: #E3ECDA
  • success-100 - HEX: #C7D8B5
  • success-200 - HEX: #A2BE84
  • success-300 - HEX: #7DA453
  • success-400 - HEX: #699739
  • success-500 - HEX: #578A21
  • success-600 - HEX: #447D08
  • success-900 - HEX: #2F5606

Pictures & Banners

Example 1

Hipcall Banner 1

Example 2

Hipcall Banner 2