SaaS Design Systems
The visual language of software companies that ship.
SaaS design has its own dialect. Bold color, clear hierarchy, interfaces built for daily use. These DESIGN.md files pull from the companies that grew SaaS from a niche category to the default way businesses buy software — Intercom, HubSpot, Slack. The tokens here help you build dashboards, admin panels, and onboarding flows that feel immediately familiar to B2B buyers.
Good for
- +B2B SaaS dashboards and admin interfaces
- +Onboarding flows and user activation screens
- +Any startup that wants to look like a real software company on day one
2 SaaS design systems
HubSpot
A CRM and marketing platform built around a warm, energetic orange (#FF7A59) paired with HubSpot's deep navy ink (#2D3748) and generous white surfaces. The system feels sales-optimized: bright, confident, action-oriented, and always pointing toward a conversion moment. Display typography uses Lexend Deca or similar legibility-optimized grotesque at bold weights with generous tracking. Cards, dashboards, and pipeline views are data-dense with clear visual hierarchy. The orange communicates urgency and warmth simultaneously — perfect for a tool where every interaction is potentially a revenue moment.
Intercom
An editorial customer-service marketing canvas built around a soft cream-white ground, charcoal type set in Saans (Intercom's proprietary geometric sans), and a single confident Fin Orange (#ff5600) reserved for the Fin AI brand. Cards live as floating white tiles with thin hairline borders and minimal radii (8–16px). Display headlines run Saans at weight 500 with measured negative tracking. The system reads as a careful, product-led publication: product screenshots dominate, ornament is rare, and the only place chromatic energy enters is the Fin Orange CTA.