Typography, colors, and visual identity
Our brand colors create a vibrant, modern, and trustworthy identity.
#5B21B6
Primary brand color, CTAs
#A855F7
Secondary accents, highlights
#EC4899
Emphasis, alerts, important UI
#FEF3C7
Backgrounds, soft highlights
#F9FAFB
Backgrounds, cards
We use Noto Sans for headings and Inter for body text.
text-6xl font-bold font-displayAI-Powered Travel Management
text-5xl font-bold font-displayTransform Your Travel Program
text-4xl font-semibold font-displayKey Features and Benefits
text-3xl font-semibold font-displayHow It Works
text-2xl font-semibold font-displayProduct Details
text-xl font-semibold font-sansSection Title
text-lg font-semibold font-sansSubsection Title
text-lg font-normal font-sansThis is large body text for introductions and important content that needs emphasis without being a heading.
text-base font-normal font-sansThis is standard body text used for paragraphs, descriptions, and general content throughout the application.
text-sm font-normal font-sansThis is small body text used for secondary information, captions, and supporting details.
text-xs font-normal font-sansThis is caption text used for labels, metadata, and fine print.
Available weights for Noto Sans and Inter.
Regular (400)
The quick brown fox
Medium (500)
The quick brown fox
Semibold (600)
The quick brown fox
Bold (700)
The quick brown fox
Examples of how our brand colors work together with glassmorphic design.
Tinted glass card with subtle border
Colored glass with enhanced tint
Primary colored text
Secondary colored text
Emphasis colored text
Primary text
Secondary text
Tertiary text
Consistent spacing creates visual harmony.
.space-1.space-2.space-3.space-4.space-6.space-8.space-12.space-16.space-24Rounded corners and glassmorphic surfaces for modern, friendly UI.
Small (2px)
.rounded-smDefault (4px)
.roundedLarge (8px)
.rounded-lgXL (16px)
.rounded-2xlLight Glass (10% tint)
Medium Glass (20% tint)
Heavy Glass (30% tint)