Что это такое
In и em — единицы измерения, которые живут в разных мирах: дюймы пришли из полиграфии и физических устройств, а em — относительная величина, зависящая от текущего размера шрифта. Конвертер in в em решает задачку перевода между ними по формуле W3C, учитывая базовый font-size, который вы задаёте самостоятельно. Это не просто таблица умножения, а инструмент, который помогает понять, как физический размер соотносится с «резиновыми» CSS-единицами в вебе.
Как пользоваться
- Введите числовое значение в дюймах (in) в поле конвертера — можно дробное, например, 1.5.
- Укажите базовый размер шрифта (по умолчанию стоит стандартный 16px), если ваш макет использует другой, например, 14px или 20px.
- Нажмите кнопку конвертации — калькулятор мгновенно покажет результат в em.
- Скопируйте полученное CSS-свойство в буфер обмена одной кнопкой — оно сразу готово для вставки в стили.
- Используйте таблицу соответствий ниже, если нужно быстро посмотреть популярные значения без повторного ввода.
Кому и когда пригодится
В первую очередь — верстальщикам, которые получают макеты из Figma или Photoshop, где размеры часто указаны в физических единицах. Если вы делаете адаптивные сайты на em, придётся переводить дюймы в em для шрифтов, отступов и размеров блоков. Также инструмент полезен дизайнерам, проверяющим, как поведёт себя макет при разных базовых размерах шрифта, и разработчикам, создающим email-рассылки или PDF-стили. Наконец, он пригодится всем, кто работает с полиграфией и параллельно пишет CSS — чтобы не держать в голове формулы перевода.
Плюсы и ограничения
Плюсы:
- Мгновенный расчёт по стандартной формуле W3C — не нужно ничего вычислять вручную.
- Гибкая настройка базового шрифта — результат точен для вашего конкретного проекта.
- Копирование готового CSS-свойства в один клик ускоряет работу.
- Таблица соответствий помогает быстро ориентироваться в популярных значениях.
Ограничения:
- Дюймы — абсолютная величина, а em всегда зависит от контекста, поэтому результат нельзя назвать универсальным.
- Инструмент не учитывает, что на разных устройствах физический дюйм может отображаться по-разному из-за плотности пикселей.
- Если базовый шрифт изменится, пересчёт придётся делать заново.
Частые вопросы
Почему в конвертере нужно указывать базовый шрифт?
Em — относительная единица: 1em равен текущему размеру шрифта родительского элемента. Если базовый шрифт 16px, то 1in (96px) будет равен 6em. При базовом шрифте 20px тот же дюйм превратится уже в 4.8em. Без настройки конвертер не сможет дать корректный ответ.
Как перевести дюймы в em, если я знаю только размер в пикселях?
Сначала переведите дюймы в пиксели (1in = 96px), а затем разделите на базовый размер шрифта. Конвертер делает оба шага автоматически, но если вы работаете вручную — формула простая: em = (дюймы × 96) / font-size.
Влияет ли плотность экрана на результат?
Напрямую нет — CSS-дюйм всегда считается как 96px, независимо от физического разрешения. Но если вы пытаетесь добиться одинакового физического размера на экране и бумаге, придётся учитывать DPI отдельно, и конвертер здесь не помощник.
Можно ли использовать em для размеров, не связанных со шрифтом?
Да, em работает для любых CSS-свойств: padding, margin, width, height. Но помните, что для margin и padding em считается от размера шрифта самого элемента, а не родителя — это частая причина ошибок у новичков.
Почему в таблице соответствий нет всех возможных значений?
Таблица показывает самые ходовые значения для типовых макетов — от 0.1in до 2in. Для нестандартных чисел используйте ручной ввод: конвертер обработает любые значения с точностью до нескольких знаков.