Typography - Darwin Pro
The CESS FRSah design system uses Darwin Pro for UI text. The default app body size is text-sm.
Font families
Font stacks used across the interface.
The quick brown fox jumps over the lazy dog.
Body
font-bodyDarwin Pro, sans-serif
Weights: 300, 400, 600, 700
Font weights
Weights used across the interface.
Typography sample
Normal
text-lg font-normalWeight: 400
Typography sample
Medium
text-lg font-mediumWeight: 500
Typography sample
Semibold
text-lg font-semiboldWeight: 600
Typography sample
Bold
text-lg font-boldWeight: 700
Type scale
Standard text sizes used in pages, cards, and forms.
Caption, button label, metadata
Extra small
text-xs text-foregroundSize: 12px
Body text, form fields, table content
Small
text-sm text-foregroundSize: 14px
Sidebar club name
Base
text-base text-foregroundSize: 16px
Page title, public page heading
Large
text-lg text-foregroundSize: 18px
Profile title, stat card value
Extra large
text-xl text-foregroundSize: 20px
Auth page heading
2XL
text-2xl text-foregroundSize: 24px
Text styles
Common typography combinations used in CESS FRSah.
Club members
Page title
text-lg font-semibold text-foregroundIdentification details
Section heading
text-sm font-semibold text-foregroundCSU ASE Bucharest
Profile title
text-xl font-semibold text-foregroundClub description and form helper text.
Body
text-sm text-muted-foregroundSecondary information and timestamps.
Muted
text-xs text-muted-foregroundSave changes
Button
text-xs font-semiboldAbout the club
Section label
text-xs font-semibold uppercase tracking-wide text-muted-foregroundQuick actions
Eyebrow
text-xs font-semibold uppercase tracking-widest text-primary42
Stat value
text-xl font-semibold text-foregroundChess for everyone, everywhere.
Tagline
text-sm italic text-muted-foregroundView details
Table link
text-sm font-normal text-primary