📏 Один набор инструментов для
любой задачи проектирования

Конвертер PX в REM

Мгновенно конвертируйте пиксели в REM и обратно, с настраиваемым базовым размером шрифта и полной таблицей пересчёта. Незаменим для доступного, масштабируемого CSS.

English 中文 日本語 한국어 Español Português Français Deutsch العربية हिन्दी ไทย Tiếng Việt Bahasa Русский

📏 Конвертер PX в REM

Руководство по конвертации PX в REM

REM (root em) — это единица CSS, относительная к корневому размеру шрифта документа, обычно 16px. Поскольку значения rem масштабируются вместе с настройками шрифта браузера пользователя, дизайн на rem остаётся доступным и пропорциональным на всех устройствах — в отличие от фиксированных пикселей.

Введите значение в пикселях, чтобы увидеть эквивалент в rem, или введите rem для обратной конвертации. Настройте базовый размер шрифта под свой проект (некоторые дизайн-системы используют корень 10px или 20px). Таблица охватывает самые распространённые размеры, а визуальное сравнение показывает, что обе единицы выглядят одинаково при одном корневом размере.

Pro Tips

Frequently Asked Questions

Q: В чём разница между REM и EM?
В чём разница между REM и EM? rem всегда относителен к корневому размеру шрифта (html). em относителен к размеру шрифта родительского элемента, поэтому em накапливается во вложенных элементах, а rem остаётся постоянным.
Q: Почему REM вместо PX?
Почему REM вместо PX? REM масштабируется с настройками доступности пользователя — тот, кто увеличивает размер шрифта браузера, видит весь текст крупнее. PX остаётся фиксированным и может ломать макеты или доступность. Современная практика — rem для типографики и отступов.
Q: Какой базовый размер шрифта по умолчанию?
Какой базовый размер шрифта по умолчанию? Все основные браузеры по умолчанию используют 16px = 1rem. Поэтому при стандартном корне: 32px = 2rem, 8px = 0.5rem, 24px = 1.5rem.
Q: Можно ли использовать REM в медиа-запросах?
Можно ли использовать REM в медиа-запросах? Да. Медиа-запросы на rem реагируют на настройки шрифта пользователя, а не только на ширину вьюпорта — тонкое улучшение доступности по сравнению с брейкпоинтами на px.
Q: Нужно ли конвертировать каждое значение вручную?
Нужно ли конвертировать каждое значение вручную? Нет. Современные инструменты сборки (PostCSS, Tailwind) делают это автоматически. Используйте калькулятор для быстрых разовых конвертаций и проверки написанного вручную CSS.

Русские традиционные цвета

От гжельской синевы до хохломского золота — русская палитра рождена народными промыслами, иконописью и северной природой. Эти цвета до сих пор вдохновляют дизайнеров по всему миру.

Алый #FF2400

Алый цвет знамён, сарафанов и праздничной символики

Васильковый #6495ED

Цвет полевых васильков — символ русских лугов

Золото Хохломы #D4AF37

Золотой орнамент хохломской росписи

Гжель Синий #005A9C

Кобальтовая синева гжельской керамики

Изумрудный #50C878

Цвет уральских самоцветов и малахита

Бордовый #800020

Тёмно-красный цвет театральных занавесов

Янтарный #FFBF00

Балтийский янтарь — золото Калининграда

Сиреневый #C8A2C8

Нежная сирень майских садов

Охристый #CC7722

Цвет иконописи и древних фресок

Снежно-белый #F8F8FF

Белый снег русских зим

Q: Что такое гжель?
Что такое гжель? Гжель (#005A9C) — традиционная русская керамика с синей кобальтовой росписью на белом фоне, производимая в Подмосковье с XVIII века и ставшая символом русского народного искусства.
Q: Что такое хохлома?
Что такое хохлома? Хохлома — традиционная деревянная роспись с золотым орнаментом (#D4AF37) на чёрном или красном фоне, создаваемая в Нижегородской области с XVII века.