Перейти к содержимому
Aback Tools Logo

Конвертер размера шрифта

Мгновенно переводите размеры шрифта между px, em, rem, %, pt и vw с нашим бесплатным конвертером. Введите любое значение, выберите исходную единицу и получите результаты в реальном времени по всем шести единицам CSS с настраиваемым базовым размером шрифта и шириной окна. Есть живой предпросмотр текста, кликабельные карточки единиц для продолжения перевода, справочная таблица распространённых значений в пикселях и копирование любого значения в один клик. Полностью приватно, 100 % бесплатно и без регистрации.

Font Size Converter
Convert font sizes between px, em, rem, %, pt, and vw with configurable base font size and viewport width. See live results and a full reference table for common pixel values.
CSS Output
font-size: 16px;

Preview

The quick brown fox jumps over the lazy dog

Preview at 16px -

Common Font Sizes

Reference Table - Common PX Values(root: 16px, viewport: 1920px)

pxremem%ptvw
40.250.2525%30.2083
80.50.550%60.4167
100.6250.62562.5%7.50.5208
120.750.7575%90.625
140.8750.87587.5%10.50.7292
1611100%120.8333
181.1251.125112.5%13.50.9375
201.251.25125%151.0417
241.51.5150%181.25
281.751.75175%211.4583
3222200%241.6667
362.252.25225%271.875
402.52.5250%302.0833
4833300%362.5
563.53.5350%422.9167
6444400%483.3333
724.54.5450%543.75
9666600%725

Зачем использовать наш конвертер размера шрифта?

  • Мгновенный перевод между единицами: конвертер сразу показывает эквивалентные значения во всех шести единицах — px, em, rem, %, pt и vw — по мере ввода. Никаких кнопок и перезагрузок страницы. Каждая карточка единицы кликабельна, поэтому можно сразу продолжить перевод из любой выходной единицы.
  • Настраиваемая база и окно: задайте базовый размер шрифта (по умолчанию 16px) и ширину окна (по умолчанию 1920px) под контекст вашего проекта. Выберите готовые значения или введите свои. Все переводы обновляются мгновенно при изменении этих настроек.
  • 100 % приватно — без загрузки: все переводы размеров шрифта выполняются локально в браузере. Ваши значения не покидают устройство и не отправляются на сервер — безопасно для проприетарных дизайн-систем и клиентских проектов.
  • Бесплатно и без ограничений: переводите размеры шрифта без ограничений, без регистрации, без подписки и без лимитов. Конвертер размера шрифта полностью бесплатен навсегда, без рекламы, перекрывающей интерфейс.

Типичные случаи использования конвертера размера шрифта

  • UI- и веб-дизайн: дизайнеры интерфейсов используют конвертер, чтобы перевести размеры шрифта из макетов (обычно в px из Figma или Sketch) в адаптивные единицы rem или em для разработки. Так макеты реализуются точно, сохраняя доступность и масштабируемость.
  • Разработка CSS: фронтенд-разработчики используют конвертер, чтобы перевести пиксельные значения из спецификации дизайна в наиболее подходящую единицу CSS — rem для глобальной типографики, em для размеров внутри компонента, vw для «текучих» заголовков и pt для печатных таблиц стилей.
  • Адаптивная типографика: те, кто делает адаптивные сайты, используют конвертер для расчёта «текучих» типошкал. Переводя между px и vw при разных ширинах окна, можно создавать функции clamp(), которые плавно масштабируют текст на всех экранах.
  • Токены дизайн-систем: те, кто поддерживает дизайн-системы, используют конвертер для определения согласованных токенов типошкалы. Перевод базового набора пиксельных значений в rem, em и проценты гарантирует работу системы во всех контекстах единиц CSS.
  • Соответствие требованиям доступности: специалисты по доступности используют конвертер, чтобы проверить, соответствуют ли размеры шрифта требованиям WCAG. Понимание связи px и rem помогает убедиться, что текст учитывает пользовательские настройки размера (WCAG 1.4.4 «Изменение размера текста»).
  • Дизайн для печати и PDF: дизайнеры печати используют конвертер для перевода между px (экран) и pt (печать). Это гарантирует, что цифровые макеты будут точно воспроизведены в печати в правильном физическом размере.

Что такое конвертер размера шрифта?

Конвертер размера шрифта переводит значения размера шрифта между разными единицами CSS — px, em, rem, %, pt и vw. У каждой единицы свои особенности и области применения. Наш инструмент переводит любое введённое значение сразу во все шесть единиц, с настраиваемым базовым размером шрифта и шириной окна под точный контекст проекта. Все переводы выполняются мгновенно в браузере.

Зачем использовать относительные единицы для размеров шрифта?

Использование относительных единиц (rem, em, vw) для размеров шрифта — требование доступности WCAG. Критерий успеха 1.4.4 в WCAG 2.1 («Изменение размера текста») требует, чтобы текст можно было увеличить до 200 % без потери содержания и функциональности. Если задавать текст в px, предпочтение пользователя по размеру шрифта в браузере игнорируется: тот, кто установил в браузере 20px по умолчанию, увидит тот же мелкий текст, что и пользователь с 16px.

REM — рекомендуемая единица для типографики в большинстве современных CSS-архитектур: она учитывает предпочтения пользователя, обеспечивает единообразный размер по всей странице и делает глобальную настройку размера шрифта такой же простой, как изменение одного значения у элемента <html>. Наш конвертер помогает перевести пиксельные спецификации дизайна в доступные адаптивные единицы.

Как пользоваться этим конвертером размера шрифта

  1. Введите значение: наберите любое положительное число в поле ввода. Выберите единицу (px, em, rem, %, pt или vw) в выпадающем списке. Конвертер сразу покажет результаты во всех шести единицах.
  2. Настройте базовые параметры: задайте базовый размер шрифта и ширину окна под свой проект. Доступны быстрые готовые значения, либо введите собственное. Изменение этих настроек обновляет все переводы в реальном времени.
  3. Проверьте и скопируйте: на каждой карточке единицы показано переведённое значение. Нажмите на карточку, чтобы сделать эту единицу исходной и продолжить перевод. Наведите курсор на карточку и нажмите значок копирования, чтобы скопировать отформатированное значение. Также приводится CSS-объявление для быстрой вставки в таблицу стилей.
  4. Используйте справочную таблицу: в справочной таблице показаны распространённые пиксельные значения, переведённые во все единицы с вашими настройками, — удобно для быстрого поиска стандартных размеров.

Часто задаваемые вопросы

Конвертер размера шрифта переводит значения размера шрифта между разными единицами CSS — px, em, rem, %, pt и vw. Наш конвертер мгновенно показывает эквивалентные значения сразу во всех шести единицах с настраиваемым базовым размером шрифта и шириной окна.

Просто введите положительное число в поле ввода и выберите исходную единицу в списке — конвертер сразу покажет эквивалентные значения во всех шести единицах. Нажмите на любую карточку результата, чтобы сделать эту единицу новой исходной. Наведите курсор на карточку, чтобы скопировать отформатированное значение.

rem задаётся относительно размера шрифта корневого элемента (<html>): 1rem всегда равен базовому размеру шрифта. em задаётся относительно размера шрифта родительского элемента и накапливается при вложенности. Rem предсказуемее для глобальных размеров, em удобен для размеров внутри компонента.

По умолчанию браузер использует базовый размер 16px — это самый распространённый вариант. Некоторые дизайнеры берут 10px, чтобы упростить расчёты в rem. Наш конвертер поддерживает любой базовый размер: выберите готовый вариант или введите своё значение.

Единицы vw (ширина окна) делают размер шрифта относительным к ширине окна браузера: 1vw = 1 % ширины окна. На экране шириной 1920px 1vw = 19,2px. VW часто применяют внутри CSS-функции clamp() с минимальными и максимальными границами для «текучей» типографики.

rem = px ÷ базовый размер шрифта. При стандартной базе 16px: 16px = 1rem, 24px = 1,5rem, 32px = 2rem. Для vw: vw = (px ÷ ширина окна) × 100. Для pt: pt = px ÷ 1,333. Наш конвертер применяет все формулы мгновенно.

Да. Все переводы выполняются на 100 % на стороне клиента, в вашем браузере. Ваши значения никогда не отправляются на сервер, не сохраняются и никуда не передаются.

Да. Конвертер размера шрифта на 100 % бесплатен: без регистрации, без премиум-функций и без ограничений по использованию. Переводите размеры шрифта без ограничений.