Конвертер px в rem: px, rem, pt, em, mm
Последнее обновление:
rem отсчитывается от этого размера. Здесь em и % тоже, хотя в CSS они зависят от родительского элемента, поэтому совпадают с rem лишь там, где ни один родитель не меняет размер шрифта.
1 px = 0,0625 remВсе результаты
Быстрая таблица: Пиксель → Root em
| Значение (px) | Результат (rem) |
|---|---|
| 1 px | 0,0625 rem |
| 8 px | 0,5 rem |
| 10 px | 0,625 rem |
| 12 px | 0,75 rem |
| 14 px | 0,875 rem |
| 16 px | 1 rem |
| 18 px | 1,125 rem |
| 20 px | 1,25 rem |
| 24 px | 1,5 rem |
| 32 px | 2 rem |
| 48 px | 3 rem |
| 64 px | 4 rem |
О px, rem и pt
В CSS 1 дюйм равен 96 px, поэтому 1 pt, то есть 1/72 дюйма, равен 1,333 px, а 1 mm равен 3,78 px. rem и em относительны: 1 rem равен размеру шрифта корневого элемента, в любом популярном браузере это 16 px, если пользователь его не менял, поэтому 24 px равно 1,5 rem. Если таблица стилей задаёт другой корневой размер, введите его как базу над полями. em следует размеру шрифта родительского элемента, поэтому равен rem только там, где ни один родитель его не меняет.
Распространённые размеры текста и элементов
При базе по умолчанию 16 px. В CSS 1 дюйм равен 96 px, поэтому столбцы pt и mm верны при любой базе; меняется только столбец rem.
| Размер | rem | pt | mm |
|---|---|---|---|
| Текст 10 pt (сноски) | 0,8333 | 10 | 3,528 |
| Размер текста по умолчанию в браузере | 1 | 12 | 4,233 |
| Текст 12 pt в текстовом редакторе | 1 | 12 | 4,233 |
| Заголовок h2 по умолчанию | 1,5 | 18 | 6,35 |
| Минимальный размер кнопки или ссылки по WCAG 2.2 (2.5.8) | 1,5 | 18 | 6,35 |
| Заголовок h1 по умолчанию | 2 | 24 | 8,467 |
| 1 сантиметр | 2,362 | 28,35 | 10 |
| 1 дюйм | 6 | 72 | 25,4 |
История пункта и пикселя
Шрифт измеряли в пунктах задолго до экранов: словолитчикам нужна была общая мера, чтобы отлитые литеры вставали в одну строку. Компьютеры остановились на пункте в 1/72 дюйма.
- Пьер-Симон Фурнье опубликовал таблицу размеров шрифта, измеренных в типографских пунктах: её шкала делила дюйм на 12 линий, а каждую линию на 6 пунктов.
- Ассоциация словолитчиков Соединённых Штатов приняла пунктовую систему для кеглей шрифта, в которой нонпарель составляет 6 пунктов, а пика 12.
- Adobe представила PostScript. Единица длины на странице в нём равна 1/72 дюйма: по словам Adobe, это примерно типографский пункт, которым пользуются в печати.
- CSS 2.1 стал рекомендацией W3C. В нём 1 дюйм равен 96 px и 72 pt, поэтому 1 px равен 0,75 pt. Пиксель там определён через одну точку экрана в 96 dpi, на который смотрят с расстояния вытянутой руки.
Источники: