Article

Startup Branding Guide: Visual Identity (Color System and Typography)

Metabrand Free Beginner

Most guides talk about picking a palette OR a font. This one treats color and type as one system and, crucially, walks through making that system hold up across both your marketing site and your product UI, which is exactly where dated or clashing choices show up. It is strategy-first (color and type follow from positioning), so you end up with picks you can defend in two years instead of ones you chase off a trend list.

  • Start from brand personality and positioning, not a mood board: a palette and typeface chosen to express one idea age far better than ones picked because they looked nice this year.
  • Build the palette with depth (a primary, neutrals for surfaces and text, one accent, plus tints and shades) so it can carry a real product UI, not just a hero image.
  • Set a small type system with clear hierarchy rules that work in both marketing and app screens, so your headline font does not fight your interface font.
Open on metabrand.digital ↗

The question it answers

  1. How do I pick brand colors and a font that don't look dated in two years and don't fight my product UI?

Read with it

  1. The safest place to pick fonts you can actually ship: everything is free, open source, and licensed for commercial use (logos,... Google Fonts Tool Google Fonts Google
  2. A pretty palette that no one can read reads as careless, and this is the fastest way to catch that before it ships. Paste a... WebAIM Tool WebAIM Contrast Checker WebAIM
eChai Partner Brands The partnership →