Oracul DS
ui

Типографика

Шрифты, размеры, веса и цвета текста в Oracul DS.

Семейства шрифтов

--font-heading

Geist — Заголовки

The quick brown fox jumps over the lazy dog

Съешь же ещё этих мягких французских булок

--font-sans

CalSans UI — Основной текст

The quick brown fox jumps over the lazy dog

Съешь же ещё этих мягких французских булок

--font-mono

PaperMono — Код

const x = 42; // hello world

Компоненты типографики

<Display>

Дисплейный заголовок

<H1>

Заголовок первого уровня

<H2>

Заголовок второго уровня

<H3>

Заголовок третьего уровня

<H4>

Заголовок четвёртого уровня

<H5>
Заголовок пятого уровня
<H6>
Заголовок шестого уровня
<Lead>

Вводный абзац увеличенного размера с приглушённым цветом

<Body>

Основной текст страницы, стандартный размер и межстрочный интервал

<Small>

Мелкий текст для подписей и вспомогательной информации

<Muted>

Приглушённый мелкий текст, например для метаданных

<Overline>

Надпись над разделом

<Mono>
const x = 42;

Размеры текста

text-xs / 12px
The quick brown fox jumps over the lazy dog
text-sm / 14px
The quick brown fox jumps over the lazy dog
text-base / 16px
The quick brown fox jumps over the lazy dog
text-lg / 18px
The quick brown fox jumps over the lazy dog
text-xl / 20px
The quick brown fox jumps over the lazy dog
text-2xl / 24px
The quick brown fox jumps over the lazy dog
text-3xl / 30px
The quick brown fox jumps over the lazy dog
text-4xl / 36px
The quick brown fox jumps over the lazy dog
text-5xl / 48px
The quick brown fox jumps over the lazy dog
text-6xl / 60px
The quick brown fox jumps over the lazy dog
text-7xl / 72px
The quick brown fox jumps over the lazy dog

Насыщенность (Geist)

font-normal / 400
The quick brown fox jumps over the lazy dog
font-medium / 500
The quick brown fox jumps over the lazy dog
font-semibold / 600
The quick brown fox jumps over the lazy dog
font-bold / 700
The quick brown fox jumps over the lazy dog
font-extrabold / 800
The quick brown fox jumps over the lazy dog
font-black / 900
The quick brown fox jumps over the lazy dog

Цвета текста

text-foreground
Основной текст
text-muted-foreground
Приглушённый текст
text-primary
Акцентный текст
text-destructive
Текст ошибки

Межбуквенный интервал

tracking-tighter
The quick brown fox jumps over the lazy dog
tracking-tight
The quick brown fox jumps over the lazy dog
tracking-normal
The quick brown fox jumps over the lazy dog
tracking-wide
The quick brown fox jumps over the lazy dog
tracking-wider
The quick brown fox jumps over the lazy dog
tracking-widest
The quick brown fox jumps over the lazy dog

Межстрочный интервал

leading-none

Полностью настраиваемое программное обеспечение для планирования встреч для частных лиц и команд. Безлимитно и бесплатно.

leading-tight

Полностью настраиваемое программное обеспечение для планирования встреч для частных лиц и команд. Безлимитно и бесплатно.

leading-snug

Полностью настраиваемое программное обеспечение для планирования встреч для частных лиц и команд. Безлимитно и бесплатно.

leading-normal

Полностью настраиваемое программное обеспечение для планирования встреч для частных лиц и команд. Безлимитно и бесплатно.

leading-relaxed

Полностью настраиваемое программное обеспечение для планирования встреч для частных лиц и команд. Безлимитно и бесплатно.

leading-loose

Полностью настраиваемое программное обеспечение для планирования встреч для частных лиц и команд. Безлимитно и бесплатно.