Brand & Press

Logo

Our wordmark pairs the Happo hippo with the Happo type. Use the full wordmark whenever space allows; reach for the mark on its own only when the wordmark would be illegible (favicons, app icons, very small UI).

Downloads

SVG is preferred for the web and print. PNGs are provided at 2× resolution for places that don't accept vector files.

Usage guidelines

Keep the logo legible and unambiguous. Maintain clear space around the mark equal to the height of the hippo's ear, and don't let it shrink below 24px tall in digital contexts or 0.5in in print.

• Do

  Use the full-color wordmark on white or very light backgrounds.

• Do

  Use the white wordmark on dark, high-contrast backgrounds.

• Do

  Give the logo breathing room. Keep at least one ear-height of clear space on every side.

• Don't

  Don't recolor the wordmark or apply gradients, shadows, or outlines.

• Don't

  Don't stretch, rotate, or rearrange the hippo and the type.

• Don't

  Don't place the logo on a busy photo or a background that doesn't meet WCAG AA contrast against the mark.

Color palette

These are the colors used across happo.io and in product. Pair our brand teal with magenta sparingly — magenta carries weight and should signal action.

• Brand TealPrimary brand color · logo

  hex

  #14AA8C

  rgb

  rgb(20, 170, 140)

  hsl

  hsl(168, 79%, 37%)

  oklch

  oklch(66% 0.1224 174)

• MagentaPrimary UI · links, CTAs

  hex

  #B5008B

  rgb

  rgb(181, 0, 139)

  hsl

  hsl(314, 100%, 35%)

  oklch

  oklch(0.51 0.21 356)

• Accessible TealHigher-contrast text and UI on light backgrounds

  hex

  #2FAA98

  rgb

  rgb(47, 170, 152)

  hsl

  hsl(171, 57%, 43%)

  oklch

  oklch(62% 0.12 174)

Naming

• Happo — always capitalized, never "HAPPO" or "happo". Pronounced hap-oh.
• The company is Happo LLC. The product is Happo.
• Happo is a registered EU trademark.