notion
SaaS dashboard aesthetic with clean data focus and productivity tool styling
Design Aesthetic
Clean, functional SaaS interface aesthetic. Dashboard-inspired layouts with clear data hierarchy. Notion, Linear, and modern productivity tool styling. Information-dense but organized. Professional and trustworthy.
Background
Color: Light Gray (#F7F7F5) or Pure White (#FFFFFF)
Texture: None - clean solid backgrounds
Typography
Primary Font (Headlines)
System UI stack or Inter. Semi-bold weight for emphasis. Clean, functional letterforms. Slightly tighter letter-spacing.
Secondary Font (Body)
Same family in regular weight. Optimized for screen reading. Comfortable line height (1.5-1.6).
Color Palette
Background
Light Gray
#F7F7F5
Primary background
Card Background
Pure White
#FFFFFF
Content cards
Primary Text
Near Black
#1F1F1F
Headlines, body
Secondary Text
Gray
#6B6B6B
Metadata, labels
Border
Light Border
#E5E5E5
Card borders, dividers
Accent Blue
Notion Blue
#2383E2
Links, primary actions
Accent Green
Success
#0F7B6C
Positive metrics
Accent Red
Alert
#E03E3E
Negative metrics
Accent Yellow
Warning
#DFAB01
Cautions
Visual Elements
Card-based layouts with subtle borders or shadows
Clean data tables and charts
Progress bars and metric displays
Icon-based navigation hints
Checkbox and toggle styling
Tag and label chips
Subtle hover state styling
Breadcrumb and hierarchy indicators
Style Rules
Do
Use card-based content organization
Create clear data hierarchy
Use subtle shadows and borders
Keep layouts grid-aligned
Present metrics prominently
Don't
Use decorative illustrations
Add gradients or complex backgrounds
Create artistic layouts
Use rounded blob shapes
Add slide numbers, footers, or logos
Best For
Product demos, SaaS presentations, productivity tool pitches, metrics dashboards, feature walkthroughs, B2B presentations, technical product marketing
Last updated