# Detent design system

> The tokens, typography and theme that Detent uses. Install with shadcn and it inherits your existing colours and fonts.

Canonical: https://detentui.com/system
Last updated: 2026-11-10

## Design tokens

Detent ships a set of CSS custom properties (design tokens) that map to your shadcn theme. Your `--primary` becomes Detent's accent, `--background` and `--foreground` are inherited, and `.dark` on the HTML element enables the dark variant automatically.

## Typography

Detent uses Geist and Geist Mono from Google Fonts. All font sizes are set with the Tailwind v4 type scale.

## Install

```bash
npx shadcn add https://detentui.com/r/theme.json
```

## Related
- [Components](https://detentui.com/components)