Modern design system with Inter and Space Grotesk typography
#16225c - #20299c
primary-50
primary-100
primary-200
primary-300
primary-400
primary-500
primary-600
primary-700
primary-800
primary-900
primary-950
#0273ff - #30d2ff
secondary-50
secondary-100
secondary-200
secondary-300
secondary-400
secondary-500
secondary-600
secondary-700
secondary-800
secondary-900
secondary-950
#f15a28
coral-50
coral-100
coral-200
coral-300
coral-400
coral-500
coral-600
coral-700
coral-800
coral-900
coral-950
#86ffe7
seafoam-50
seafoam-100
seafoam-200
seafoam-300
seafoam-400
seafoam-500
seafoam-600
seafoam-700
seafoam-800
seafoam-900
seafoam-950
#6e71a8
lavender-50
lavender-100
lavender-200
lavender-300
lavender-400
lavender-500
lavender-600
lavender-700
lavender-800
lavender-900
lavender-950
Sea Foam
Coral
Coral
Light Blue
font-heading text-6xl font-bold (MuseoModerno)
font-heading text-4xl font-semibold
font-subheading text-2xl font-semibold (Outfit)
This is a large paragraph showcasing Outfit's excellent readability and modern geometric design. The font pairs beautifully with MuseoModerno headlines, creating a contemporary and sophisticated feel that perfectly complements our navy and coral color palette.
font-body text-lg leading-relaxed
Regular paragraph text using Outfit. This font is a modern geometric sans-serif with excellent legibility across all sizes, making it perfect for both digital interfaces and body text content.
font-body text-base
Featured Content
font-caption (uppercase small text)
“Good typography is invisible. Great typography is unforgettable.”— Matthew Carter
For navigation and SEO purposes, use the Link component. For actions and interactions, use the Button component.
Navigation: About Us | Contact
External links: Visit our partner
In content: Read more about this in our documentation.
Actions: |
Interactive elements:
Form actions:
Professional and trustworthy design using our navy and bright blue palette.
Vibrant coral adds energy and warmth to create engaging call-to-actions.
Fresh sea foam green perfect for success states and positive messaging.
This card adapts to both light and dark themes automatically.