Enterprise SaaS

Also called: B2B SaaS, Corporate SaaS, Enterprise app UI

Professional B2B software: navy shell, indigo actions, IBM Plex, dense zebra tables, uppercase labels, approval badges and role-aware layouts.

“Navy B2B”Platform Design SystemsEra: 2010s → todaySeriousTrustworthyCalm
Prompt builder
Open full screen ↗
enterprise-saas / landingEN
enterprise-saas / landingTH

Design keywords

Say these words to ask for this style.

navy sidebarindigo primaryIBM Plex Sansdense zebra tablesuppercase column headersapproval status badgescompliance sealsrequest-a-demo form hero

Enterprise SaaS is the look of software bought by procurement and used all day by operations teams. A dark navy sidebar and hero frame a calm light-grey workspace; one indigo marks actions and selection. IBM Plex Sans and Plex Mono give an engineered, trustworthy voice. Information is dense and ruled: zebra-striped tables with uppercase headers (Latin only; Thai labels stay sentence case), KPI tiles with coloured edge markers, square status badges for approval states, compliance seals, and squared avatars that read as accounts and roles rather than friends.

Best for

  • B2B platforms with roles, permissions and approval flows
  • Back-office, ERP, HR, procurement and compliance tools
  • Sales-led landing pages with a “request a demo” form
  • Admin consoles that show a lot of tabular data

Avoid for

  • Consumer apps that need delight and personality
  • Creative portfolios and lifestyle brands
  • Kids, gaming or entertainment products

✓ Do

  • Frame the app in navy (#14213D) and keep the workspace light grey (#F4F6FA)
  • Use one indigo (#4338CA) for actions and selection; status colours only for status
  • Make tables dense: 8–10px rows, zebra stripes, uppercase 11px headers, tabular mono numbers

✕ Don't

  • Don’t use gradients, glows or playful illustrations — the navy hero gets only a 32px blueprint grid and a 4px indigo bottom rule
  • Don’t use pill-shaped cards or radii above 8px
  • Don’t hide data behind cards when a table would do

Not to be confused with

On mobile

The mobile companion is for approvals on the go: navy app bar and status bar, light-grey screens, ruled white lists with square badges for each request state, a navy featured card summarising what needs sign-off and a plain white tab bar with an indigo indicator. Keep tables as stacked list rows on phones.

Prompt builder

Paste into Claude, Cursor, v0, Lovable or any coding agent to recreate this style.

✓ Audited by agent review (2×)
Copied!