Style LibraryNew · weekly review
SaaS Mobile Boutique (Calistoga + Inter)
Font pairingdisplay serif + sans + monoCalistoga + Inter — saas, boutique, electric, warm, editorial, bold, premium, fintech, business, dual font, human warmth
FontsCalistoga headingsInter body
Preview
A sample page drawn from this style’s tokens — a guide to the look, not the exact output. Fonts from Google Fonts: Calistoga, Inter.
Plan the week in ten minutes
Pull in every task, see what matters, and share one clear plan with the team.
Get startedSee how it worksDocs
Tasks done1,284+12% this week
Sign in
Emailyou@example.com
Remember meContinueToday
Review roadmapDone
Ship onboardingIn progress
Team sync3 pm
Prompt
Paste into any AI assistant before describing what to build — or attach it to a project below.
# Font pairing — SaaS Mobile Boutique (Calistoga + Inter)
Headings: Calistoga · Body: Inter
Mood: saas, boutique, electric, warm, editorial, bold, premium, fintech, business, dual font, human warmth
Best for: B2B SaaS mobile, fintech apps, analytics dashboards, marketing tools, operations platforms
Tri-stack: Calistoga (adds human warmth) for heroes 36–42pt leading-1.1; Inter 400–600 for body/UI 16–18pt; JetBrains Mono 12pt uppercase tracking-[1.5] for data labels and section badges. Scale: Hero 36–42pt, Section H2 28–32pt, Body 16–18pt, Label 12pt. Avoid italic Calistoga except editorial callouts.
```css
@import url('https://fonts.googleapis.com/css2?family=Calistoga:ital@0;1&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
```
Tailwind: `fontFamily: { display: ['Calistoga', 'serif'], body: ['Inter', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }`Use it in an app
Create a free account to attach this style to a project: the hub adds it to the prompt your AI assistant gets, so it builds every page in this look.
From UI/UX Pro Max (MIT, commit 477bcb2).View source