Qeetrix

Typography

Typography roles, font families and the fonts that ship with Qeetrix.

Roles

Each role sets a family, size, line height, weight and tracking together. A role's text-* utility sets its size and line height; the --qx-typography-<role>-* variables carry all five.

Identity for every Qeet product

display48px / 1.2 · weight 600--qx-typography-display-*text-display

Security settings

heading20px / 1.2 · weight 600--qx-typography-heading-*text-heading

Invite your team

title32px / 1.2 · weight 600--qx-typography-title-*text-title

Passkeys replace passwords on every device your team signs in from.

body14px / 1.5 · weight 400--qx-typography-body-*text-body

Work email

label13px / 1.35 · weight 500--qx-typography-label-*text-label

Region

label-compact0.8rem / 1.35 · weight 500--qx-typography-label-compact-*text-label-compact

Last signed in 2 hours ago from Mumbai

caption12px / 1.35 · weight 400--qx-typography-caption-*text-caption

BETA

micro11px / 1.35 · weight 500--qx-typography-micro-*text-micro

qk_live_7Fd2…

code13px / 1.5 · weight 400--qx-typography-code-*text-code

Font families

Qeet Display sets headings, Qeet Text sets body copy, Qeet UI sets controls, and Fira Code sets code. The Indic stack covers Indian scripts with Noto Sans. The Qeet fonts and Fira Code ship with @qeetrix/ui and load through styles.css, so they render the same without being installed.

FamilySampleStackTailwind
sansQeet ID"Qeet Text", ui-sans-serif, system-ui, sans-seriffont-sans
headingQeet ID"Qeet Display", ui-sans-serif, system-ui, sans-seriffont-heading
uiQeet ID"Qeet UI", ui-sans-serif, system-ui, sans-seriffont-ui
monoQeet ID"Fira Code", ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospacefont-mono
indicQeet ID"Noto Sans", "Noto Sans Devanagari", "Noto Sans Bengali", "Noto Sans Tamil", "Noto Sans Telugu", "Noto Sans Kannada", "Noto Sans Gujarati", "Noto Sans Gurmukhi", ui-sans-serif, system-ui, sans-serif—

On this page

RolesFont families