BRAND GUIDELINES
Typography
A structured type scale designed to create clear hierarchy, improve readability, and maintain consistency across every experience.
01
H1
Inter, 44, Bold
Line height: 120%
Used for page titles
02
H2
Inter, 32, Medium
Line height: 120%
Used for section titles
03
H3
Inter, 24, Medium
Line height: 120%
Used for subsection titles
04
Subheadings
Inter, 16, Medium
Line height: 130%
Used for supporting title text
05
Body text
Inter, 14, Regular
Line height: 150%
Used for paragraphs and content
06
LABELS
DM Mono, 12, Medium
Line height: 120%
Used for labels, tags, and metadata
Simple rules to keep the Saber identity clear, consistent, and easy to recognize across every touchpoint.
01
Consistent Spacing
Use generous and consistent spacing throughout the interface. Clear separation between sections, cards, and content blocks improves readability and creates a more refined experience.
02
Structured Dividers
Divider lines should define boundaries and organize information without drawing attention to themselves. They provide structure, rhythm, and visual clarity across layouts.
03
Clear Visual Hierarchy
Use typography, scale, and contrast to establish a clear reading flow. Headlines should lead, supporting content should follow, and important actions should remain easy to identify.
04
Purposeful Color Usage
Reserve primary brand colors for key moments such as highlights, links, and calls-to-action. A restrained palette creates stronger emphasis and maintains visual consistency.
05
Grid-Based Alignment
Align content to the established grid system. Consistent alignment creates balance, improves scanability, and ensures a cohesive experience across all screen sizes.
06
Simplicity by Default
Favor clarity over decoration. Every element should serve a purpose, allowing typography, spacing, and content to communicate effectively without unnecessary visual noise.