Modern Classic|sans + serif
professionalwarmclassicmodern

Plus Jakarta Sans + Libre Baskerville

Trust Reimagined

Modern warmth meets centuries of credibility

Plus Jakarta's friendly geometry opens doors while Libre Baskerville's classical authority closes deals. A pairing for brands building the future on foundations of trust.

Contemporary warmth meets classical authority. Plus Jakarta's friendly geometry paired with Baskerville's trusted elegance.

corporatesaas uiblog

Typefaces Used

Primarysans

Plus Jakarta Sans

Contemporary geometric sans with subtle warmth. Rising star for SaaS and tech brands.

Designed by Tokotype

Released 2020

Available weights: 200, 300, 400, 500, 600, 700, 800

Secondaryserif

Libre Baskerville

Web-optimized Baskerville revival. Timeless elegance with excellent screen rendering.

Designed by Impallari Type

Released 2012

Available weights: 400, 700

Recommended Scale

H1

Headline One

Plus Jakarta Sans · 700 · 48px · 1.1

H2

Headline Two

Plus Jakarta Sans · 600 · 32px · 1.15

H3

Headline Three

Libre Baskerville · 700 · 22px · 1.3

Body

Body text for paragraphs and long-form content.

Libre Baskerville · 400 · 17px · 1.8

Caption

Caption and metadata text

Plus Jakarta Sans · 500 · 13px · 1.5

In Context

Design Essay · 12 min read

Trust Reimagined

Modern warmth meets centuries of credibility

Plus Jakarta's friendly geometry opens doors while Libre Baskerville's classical authority closes deals. A pairing for brands building the future on foundations of trust.

Trust is built with consistency.

Lincoln Chafee

Developer Exports

Google Fonts
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;600;700&family=Libre+Baskerville:wght@400;700&display=swap" rel="stylesheet">
CSS
h1 {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 48px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

h2 {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.15;
}

h3 {
  font-family: "Libre Baskerville", serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
}

.body-text {
  font-family: "Libre Baskerville", serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.8;
}

.caption {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}
Tailwind Config
// tailwind.config.ts
import type { Config } from "tailwindcss";

const config: Config = {
  theme: {
    extend: {
      fontFamily: {
        plusjakartasans: [""Plus Jakarta Sans"", "sans-serif"],
        librebaskerville: [""Libre Baskerville"", "serif"],
      },
      fontSize: {
        "h1": ["48px", { lineHeight: "1.1", fontWeight: "700" }],
        "h2": ["32px", { lineHeight: "1.15", fontWeight: "600" }],
        "h3": ["22px", { lineHeight: "1.3", fontWeight: "700" }],
        "body": ["17px", { lineHeight: "1.8", fontWeight: "400" }],
        "caption": ["13px", { lineHeight: "1.5", fontWeight: "500" }],
      },
    },
  },
};

export default config;

AI-Ready Exports

Copy these structured prompts to brief AI tools on your typography system. Paste directly into ChatGPT, Claude, or any LLM.

System Description

Explain this type system to an AI

Use this typographic system:

Headings:
  Plus Jakarta Sans, 700 weight
  Used for H1–H3
  Contemporary geometric sans with subtle warmth. Rising star for SaaS and tech brands.

Body:
  Libre Baskerville, 400 weight
  Used for paragraphs and UI
  Web-optimized Baskerville revival. Timeless elegance with excellent screen rendering.

Tone:
  professional, warm, classic
  Contemporary warmth meets classical authority. Plus Jakarta's friendly geometry paired with Baskerville's trusted elegance.

Use this scale:
  H1 — 48px / 1.1 / -0.02em
  H2 — 32px / 1.15
  H3 — 22px / 1.3
  Body — 17px / 1.8
  Caption — 13px / 1.5

UI Generation Prompt

Use when asking AI to generate code

When generating UI or HTML, use this typography system:

H1 — Plus Jakarta Sans — 700 — 48px — line-height 1.1 — letter-spacing -0.02em
H2 — Plus Jakarta Sans — 600 — 32px — line-height 1.15
H3 — Libre Baskerville — 700 — 22px — line-height 1.3
Body — Libre Baskerville — 400 — 17px — line-height 1.8
Caption — Plus Jakarta Sans — 500 — 13px — line-height 1.5

Headings should feel professional and warm.
Body text should feel readable and refined.

Do NOT mix additional fonts.
Maintain consistent hierarchy throughout.