Конвертер px в rem

Онлайн конвертер для перевода значений из px в rem

Базовый размер шрифта px
Введите известное значение в соответствующем поле:
px
=
rem

Таблица значений rem для 16px

Измените базовое значение размера шрифта чтобы в таблице отобразились значения для нужного базового размера

pxrem
8
9
10
11
12
13
14
15
16
17
pxrem
18
19
20
21
22
23
24
25
26
27
pxrem
28
29
30
31
32
33
34
35
36
37
pxrem
38
39
40
41
42
43
44
45
46
47
Отправить ссылку в:
# Теория

px (пиксель) - это единица измерения размеров для экранов (мониторов). Используется для максимально конкретного и точного задания размеров.

rem – задаёт размер относительно размера шрифта заданного для тега <html>, используется для удобства глобального масштабирования: элементы которые планируется масштабировать, задаются в rem.

Чтобы размер шрифта масштабировался для устройств с разным расширением экрана, в css через медиа-запросы задают базовый размер шрифта для тега <html> для разных размеров экранов. Пример:

html {
    font-size: 16px;
}

@media (max-width: 576px) {
    html {
        font-size: 13px;
    }
}

@media (max-width: 768px) {
    html {
        font-size: 14px;
    }
}

@media (max-width: 992px) {
    html {
        font-size: 15px;
    }
}

***Данные размеры для свойства font-size не являются рекомендуемыми. Они просто взяты как пример. Размер напрямую зависит от используемого шрифта и его особенностей. При этом сами значения для font-size не обезательно должны быть целыми числами, а могут быть десятичными дробями: font-size: 15.7575px, что очень часто практекуется в различный css-фреймворках.

Формула для перевода из px в rem

Для перевода значений из пикселей в rem применяется следующая формула:

rem = \dfrac{px}{\text{База}}

Похожие калькуляторы:

Комментарии 2

Кто вообще придумал такие заморочки? Чем больше изучаю это, тем меньше понимаю.

px, rem, em, проценты - напридумывали кучу всего. Оставили бы одни пиксели и не морочили б голову.

Народ, помогите!

Какие размеры для html поставить для шрифта Roboto подключенного из гугл шрифтов?

Войдите чтобы писать комментарии