Typography

Naluma uses two typefaces chosen to hold both warmth and credibility — a restrained serif for headings and a humanist sans-serif for body text and UI. See the Visual Identity Direction for the typographic philosophy behind these choices.

Token source: tokens/primitive/typography.json, tokens/semantic/typography.json

---

Type Scale — Live Specimens

Headings (Literata)

The sound is still there

display 48px / wt 600 / Literata

Your tinnitus profile

h1 36px / wt 600 / Literata

Session complete

h2 28px / wt 600 / Literata

Understanding your pattern

h3 22px / wt 600 / Literata

Tonight's session

h4 18px / wt 600 / Literata

Body (Plus Jakarta Sans)

Tinnitus is the perception of sound without an external source. Most people experience some form of it — the question is how much space it takes up.

body-lg 18px / wt 400 / Plus Jakarta Sans

Tinnitus is the perception of sound without an external source. Most people experience some form of it — the question is how much space it takes up.

body-base 16px / wt 400 / Plus Jakarta Sans

Session duration: 20 minutes. Background enrichment: ocean waves, low volume.

body-sm 14px / wt 400 / Plus Jakarta Sans

Last updated 3 days ago. 12 sessions recorded.

body-xs 13px / wt 400 / Plus Jakarta Sans

Interactive (Plus Jakarta Sans)

Start tonight's session

button-lg 16px / wt 600 / Plus Jakarta Sans

Learn what's happening

button 14px / wt 600 / Plus Jakarta Sans

View history

button-sm 12px / wt 600 / Plus Jakarta Sans

Progress · Insights · Settings

nav 14px / wt 500 / Plus Jakarta Sans

Session type

label 12px / wt 600 / Plus Jakarta Sans

Recorded Monday at 9:41 PM

caption 12px / wt 400 / Plus Jakarta Sans

Data Display

42

stat 40px / wt 700 / Literata / bold figures

23:41

timer 48px / wt 300 / Plus Jakarta Sans / light, monospaced numerals

---

Font Families

Role	Token	Stack
Headings and display text	primitive.font-family.heading	'Literata', Georgia, serif
Body text and UI elements	primitive.font-family.body	'Plus Jakarta Sans', system-ui, sans-serif

Literata is an open-source variable serif designed for long-form reading. Its open counters and optical size axis give headings warmth without sacrificing authority.

Plus Jakarta Sans is a humanist geometric sans-serif with generous x-height and friendly terminals. It reads comfortably at small sizes — important for a 40+ demographic with potential visual accommodation needs.

---

Font Weights

Token	Value
primitive.font-weight.light	300
primitive.font-weight.regular	400
primitive.font-weight.medium	500
primitive.font-weight.semibold	600
primitive.font-weight.bold	700
primitive.font-weight.extrabold	800

---

Font Size Scale

Token	Value
primitive.font-size.11	11px
primitive.font-size.12	12px
primitive.font-size.13	13px
primitive.font-size.14	14px
primitive.font-size.15	15px
primitive.font-size.16	16px
primitive.font-size.18	18px
primitive.font-size.20	20px
primitive.font-size.22	22px
primitive.font-size.28	28px
primitive.font-size.36	36px
primitive.font-size.40	40px
primitive.font-size.48	48px

---

Line Height Scale

Token	Value	Usage
primitive.line-height.none	1	Timer display
primitive.line-height.tight	1.1	Stat numbers
primitive.line-height.snug	1.15	Display headings
primitive.line-height.heading	1.2	H1
primitive.line-height.sub	1.25	H2
primitive.line-height.compact	1.3	H3
primitive.line-height.cozy	1.35	H4
primitive.line-height.ui	1.4	H5, H6, interactive elements
primitive.line-height.caption	1.5	Captions
primitive.line-height.body-xs	1.6	Body XS, quotes
primitive.line-height.body-sm	1.65	Body SM
primitive.line-height.body	1.7	Body base and large

---

Letter Spacing Scale

Token	Value
primitive.letter-spacing.tight-2	-0.02em
primitive.letter-spacing.tight-1	-0.01em
primitive.letter-spacing.tight-05	-0.005em
primitive.letter-spacing.none	0
primitive.letter-spacing.wide-1	0.01em
primitive.letter-spacing.wide-2	0.02em
primitive.letter-spacing.wide-4	0.04em
primitive.letter-spacing.wide-6	0.06em
primitive.letter-spacing.wide-12	0.12em

---

Semantic Type Scale

The full set of named type styles used across the app and website. Each style composes family, size, weight, line-height, and letter-spacing into a single semantic token.

Headings

Style	Family	Size	Weight	Line Height	Letter Spacing
display	Literata (serif)	48px	600 (semibold)	1.15	-0.01em
h1	Literata (serif)	36px	600 (semibold)	1.2	-0.005em
h2	Literata (serif)	28px	600 (semibold)	1.25	0
h3	Literata (serif)	22px	600 (semibold)	1.3	0
h4	Literata (serif)	18px	600 (semibold)	1.35	0
h5	Plus Jakarta Sans	15px	700 (bold)	1.4	0.01em
h6	Plus Jakarta Sans	13px	700 (bold)	1.4	0.02em

Note: H5 and H6 switch to the body font (Plus Jakarta Sans) to signal a shift from editorial hierarchy to UI-level structure.

Body

Style	Family	Size	Weight	Line Height	Letter Spacing
body-lg	Plus Jakarta Sans	18px	400 (regular)	1.7	0
body-base	Plus Jakarta Sans	16px	400 (regular)	1.7	0
body-sm	Plus Jakarta Sans	14px	400 (regular)	1.65	0
body-xs	Plus Jakarta Sans	13px	400 (regular)	1.6	0

Interactive

Style	Family	Size	Weight	Letter Spacing
button-lg	Plus Jakarta Sans	16px	600 (semibold)	0.01em
button	Plus Jakarta Sans	14px	600 (semibold)	0.01em
button-sm	Plus Jakarta Sans	12px	600 (semibold)	0.02em
nav	Plus Jakarta Sans	14px	500 (medium)	0.01em
tab	Plus Jakarta Sans	13px	600 (semibold)	0.02em
input	Plus Jakarta Sans	15px	400 (regular)	—

Supporting

Style	Family	Size	Weight	Line Height	Letter Spacing
label	Plus Jakarta Sans	12px	600 (semibold)	—	0.04em
overline	Plus Jakarta Sans	11px	600 (semibold)	—	0.06em
caption	Plus Jakarta Sans	12px	400 (regular)	1.5	0
badge	Plus Jakarta Sans	11px	600 (semibold)	—	0.02em
quote	Plus Jakarta Sans	20px	400 (regular)	1.6	0

Data Display

Style	Family	Size	Weight	Line Height	Letter Spacing
stat	Literata (serif)	40px	700 (bold)	1.1	-0.02em
timer	Plus Jakarta Sans	48px	300 (light)	1	0.06em