📐

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

Перевод сантиметров в rem для CSS-стилей с настройкой базового размера шрифта

Загрузка инструмента...

Конвертер CM в REM онлайн — перевод сантиметров в rem для CSS

Профессиональный онлайн-конвертер для перевода сантиметров (cm) в единицы rem, используемые в веб-разработке и CSS-стилях. Конвертация cm в rem необходима при вёрстке адаптивных сайтов, когда дизайнер передаёт макет с размерами в сантиметрах, а верстальщику требуется задать стили в относительных единицах rem. Инструмент мгновенно выполняет расчёт cm to rem с учётом базового размера шрифта (font-size) корневого элемента html.

Единица измерения rem (root em) является относительной и зависит от font-size корневого элемента документа. По умолчанию в большинстве браузеров базовый размер шрифта составляет 16 пикселей. Наш калькулятор cm в rem позволяет задать любой базовый размер, что делает его незаменимым для проектов с нестандартными настройками типографики. Перевод сантиметров в rem происходит через промежуточное вычисление в пикселях: 1 сантиметр равен 37.7953 пикселей согласно спецификации CSS Values and Units Module Level 3. Далее полученное значение в пикселях делится на заданный базовый размер шрифта для получения результата в rem.

Конвертер особенно полезен при переносе дизайна из полиграфических программ (Adobe InDesign, Illustrator), где размеры задаются в сантиметрах и миллиметрах, в веб-проект, где предпочтительно использовать rem для обеспечения масштабируемости и доступности интерфейса. Также инструмент пригодится при создании CSS для печатных стилей (@media print), когда нужно точно перевести физические размеры в относительные единицы.

Использование rem вместо абсолютных единиц (px, cm, mm) является лучшей практикой в современной веб-разработке. Это обеспечивает корректное масштабирование интерфейса при изменении пользователем настроек размера шрифта в браузере, что критически важно для доступности (accessibility) и адаптивной вёрстки. Наш конвертер сантиметров в rem помогает быстро и точно выполнять такой перевод без ручных вычислений.

  • Мгновенная конвертация cm в rem с автоматическим пересчётом при вводе
  • Настраиваемый базовый размер шрифта (root font-size) для точного расчёта
  • Выбор точности результата от 1 до 6 знаков после запятой
  • Пакетная конвертация нескольких значений одновременно
  • Отображение промежуточного значения в пикселях (px)
  • Справочная таблица перевода популярных значений cm в rem
  • Копирование результата в готовом CSS-формате одним кликом
  • Экспорт пакетных результатов как CSS-код
  • Формула расчёта для каждой конвертации
  • Веб-разработчики и фронтенд-инженеры, работающие с CSS-стилями и адаптивной вёрсткой
  • UI/UX дизайнеры, передающие макеты с метрическими размерами в разработку
  • Верстальщики, переводящие полиграфический дизайн в веб-формат
  • Студенты и начинающие разработчики, изучающие CSS-единицы измерения
  • Тестировщики, проверяющие корректность размеров элементов на веб-страницах

📏 Что такое CM и REM в CSS

CM (сантиметр) — абсолютная единица измерения длины в CSS. 1 cm равен 10 миллиметрам или приблизительно 37.7953 пикселям на стандартном экране (при разрешении 96 DPI). Сантиметры редко применяются в веб-дизайне для экранной вёрстки, однако активно используются в стилях для печати и в полиграфических макетах.

REM (root em) — относительная единица измерения в CSS, равная значению font-size корневого элемента <html>. В отличие от em, которая наследует размер от родительского элемента, rem всегда отсчитывается от корня документа, что делает её предсказуемой и удобной. При стандартных настройках браузера 1rem = 16px. Единица rem широко применяется в современной адаптивной вёрстке, CSS-фреймворках (Tailwind CSS, Bootstrap), дизайн-системах и при создании масштабируемых интерфейсов.

Формула перевода: rem = cm (96 2.54) font-size-root. При базовом размере 16px: 1 cm = 37.7953 px = 2.3622 rem. Если базовый размер отличается от 16px (например, 10px, 14px, 18px или 62.5% от 16px = 10px), результат будет другим, поэтому важно указывать актуальный font-size вашего проекта.

    📊 Таблица перевода CM в REM, PX и другие единицы

    * Значения REM (10px) актуальны для проектов, где задано html &#123; font-size: 62.5%; &#125;

      Как перевести CM в REM пошагово

      1

      Проверьте базовый размер шрифта

      Убедитесь, что в поле "Базовый размер шрифта" указано корректное значение. По умолчанию установлено 16px — стандартное значение для большинства браузеров. Если в вашем проекте задан другой font-size для элемента <html>, укажите его для точного расчёта.

      2

      Введите значение в сантиметрах

      Введите число в поле ввода или выберите одно из быстрых значений. Результат отобразится мгновенно в формате rem, а также в пикселях. Для конвертации нескольких значений одновременно переключитесь на вкладку "Пакетная".

      3

      Скопируйте результат

      Нажмите кнопку "Копировать" рядом с результатом, чтобы скопировать значение в формате rem в буфер обмена. Вставьте его напрямую в ваш CSS-код. В пакетном режиме доступно копирование всех результатов сразу или готового CSS-кода.

      Примеры перевода CM в REM

      📐 Перенос полиграфического макета в веб

      Дизайнер передал макет буклета, созданный в InDesign, где заголовок имеет размер 1.5 cm. С помощью конвертера вы моментально переводите 1.5 cm в rem: при базовых 16px получается 3.5433rem. Вставляете значение в CSS — font-size: 3.5433rem — и заголовок отображается корректно.

      🖨️ Стили для печати (@media print)

      При подготовке CSS для печатной версии сайта необходимо задать отступы и размеры в единицах, совместимых как с экраном, так и с принтером. Конвертер помогает перевести желаемые физические размеры в rem для сохранения адаптивности, например, поле отступа 2 cm = 4.7244rem при стандартных настройках.

      📱 Адаптивная типографика

      Вы разрабатываете дизайн-систему, где базовые размеры текста заданы в сантиметрах по брендбуку компании. Конвертер позволяет быстро перевести весь набор размеров в rem: 0.3 cm для мелкого текста, 0.4 cm для основного, 0.6 cm для подзаголовков, 1 cm для заголовков — все значения конвертируются одновременно в пакетном режиме.

      🎓 Изучение CSS-единиц измерения

      Студент, изучающий веб-разработку, использует конвертер для наглядного понимания соотношения абсолютных единиц (cm) и относительных (rem). Справочная таблица и отображение формулы расчёта помогают закрепить знания о том, как работает система единиц в CSS и почему rem предпочтительнее фиксированных размеров.

      Частые вопросы о конвертации CM в REM

      Что такое единица REM и чем она отличается от EM?
      REM (root em) — это относительная единица CSS, привязанная к размеру шрифта корневого элемента <html>. В отличие от EM, которая наследует размер от ближайшего родительского элемента, REM всегда отсчитывается от корня документа. Это делает rem предсказуемой: 2rem всегда означает двойной размер от корневого font-size, независимо от вложенности элементов. Стандартное значение 1rem = 16px в большинстве браузеров.
      Как вычислить перевод сантиметров в rem вручную?
      Формула перевода: REM = CM 37.7953 базовый-font-size. Сначала переведите сантиметры в пиксели, умножив на 37.7953 (или точнее 96/2.54). Затем разделите полученное значение на размер шрифта корневого элемента в пикселях. Например: 2 cm 37.7953 = 75.5906 px, далее 75.5906 16 = 4.7244 rem.
      Зачем использовать rem вместо пикселей или сантиметров?
      Единица rem обеспечивает масштабируемость интерфейса: если пользователь увеличивает размер шрифта в настройках браузера, все элементы, размеры которых заданы в rem, пропорционально увеличиваются. Это критически важно для доступности (accessibility) и адаптивной вёрстки. Пиксели являются фиксированными и не масштабируются, а сантиметры предназначены для физической печати, а не для экранов.
      Какой базовый размер шрифта указывать для расчёта?
      Стандартное значение — 16px, так как все популярные браузеры (Chrome, Firefox, Safari, Edge) используют его по умолчанию. Если в вашем проекте задан иной font-size для корневого элемента html (например, 10px при использовании приёма font-size: 62.5%, или 14px, 18px), укажите именно это значение для точного расчёта rem.
      Как конвертировать несколько значений cm в rem одновременно?
      Переключитесь на вкладку "Пакетная" в конвертере. Введите все значения в сантиметрах через запятую, пробел или каждое с новой строки. Нажмите "Конвертировать все" — результаты отобразятся в таблице с возможностью скопировать каждое значение отдельно, все результаты сразу или готовый CSS-код для вставки в проект.
      Насколько точна конвертация cm в rem в этом инструменте?
      Конвертер использует точную формулу из спецификации CSS: 1 cm = 96/2.54 пикселей (37.795275590551...px). Это значение определено стандартом W3C CSS Values and Units Module Level 3. Вы можете выбрать точность от 1 до 6 знаков после запятой в зависимости от требований вашего проекта. Для большинства задач достаточно 4 знаков.
      Безопасно ли пользоваться этим конвертером?
      Абсолютно безопасно. Все вычисления выполняются исключительно в вашем браузере на стороне клиента. Никакие данные не отправляются на сервер. Конвертер не требует регистрации, не собирает персональную информацию и работает полностью офлайн после загрузки страницы.

      Полезная информация

      Используйте приём html &#123; font-size: 62.5%; &#125; для упрощения расчётов: 1rem станет равен 10px, что значительно облегчает перевод

      Задавайте размеры шрифтов, отступов и блочных элементов в rem для масштабируемости, а границы (border) и тени (box-shadow) — в px

      Для медиа-запросов (@media) предпочитайте em, а не rem, так как некоторые браузеры обрабатывают их по-разному в контексте @media

      Тестируйте сайт при увеличенном размере шрифта в настройках браузера (например, 200%), чтобы убедиться в корректной работе rem-вёрстки

      В CSS-фреймворках вроде Tailwind CSS все утилитарные классы уже основаны на rem, что автоматически обеспечивает доступность

      При переносе макетов из Figma или Sketch используйте плагины для автоматической конвертации размеров или наш пакетный режим

      Онлайн-конвертер cm в rem на ТулФокс постоянно обновляется и совершенствуется.

      Все расчёты производятся локально в вашем браузере, что гарантирует конфиденциальность и мгновенную скорость работы. Конвертер соответствует спецификации W3C CSS Values and Units Module Level 3 и обеспечивает точные результаты для профессиональной веб-разработки.

      Если вам нужны дополнительные конвертации CSS-единиц (px в rem, em в rem, pt в rem, mm в rem и другие), следите за обновлениями — мы расширяем линейку инструментов для веб-разработчиков. По вопросам и предложениям обращайтесь через форму обратной связи.

      Комментарии (1)

      Был ли полезен этот инструмент?
      Руслан Авдеев (автор проекта)1 янв. 2024 г., 00:00
      🎉 Спасибо, что используете наши инструменты! Все инструменты на ToolFox полностью бесплатны и постоянно улучшаются. 📝 Пожалуйста, оставляйте комментарии: - Если инструмент работает некорректно - Если есть идеи по улучшению - Поделитесь своим опытом использования 👍 Ставьте лайки/дизлайки - это помогает мне понять, какие инструменты нуждаются в доработке. Я обновляю сайт каждую неделю на основе вашей обратной связи. ⭐ Если вам нравится ToolFox — буду благодарен за отзыв о сайте в Яндекс.Браузере (нажмите на ⋮ → «Оценить сайт» в панели браузера). Это помогает другим людям находить наши инструменты! 😊 Также вы можете написать мне напрямую в Telegram: @avdeevrus Все доработки и улучшения по вашим пожеланиям делаю бесплатно! Благодарю за доверие и использование ToolFox! 🚀