Конвертер пикселей в EM/REM
Конвертируйте px, rem, em, pt и % с живой таблицей и готовым к копированию CSS
rem относителен корневого размера шрифта; em и % относительны родительского.
| PX | REM | EM | PT |
|---|---|---|---|
| 10 | — | — | — |
| 12 | — | — | — |
| 14 | — | — | — |
| 16 | — | — | — |
| 18 | — | — | — |
| 20 | — | — | — |
| 24 | — | — | — |
| 28 | — | — | — |
| 32 | — | — | — |
| 40 | — | — | — |
| 48 | — | — | — |
| 64 | — | — | — |
О Конвертер пикселей в EM/REM
Конвертер пикселей в EM/REM переводит значения длины CSS между px, rem, em, pt и процентами. Введите значение в любой из пяти единиц, и живая таблица покажет его эквивалент во всех остальных — плюс готовый к копированию фрагмент CSS, который можно вставить прямо в таблицу стилей.
Преобразования учитывают, как CSS фактически разрешает единицы: rem относится к размеру шрифта корневого элемента, а em и % относятся к размеру шрифта родительского элемента. Оба базовых размера можно редактировать, так что вы можете смоделировать корень 16 px с компонентом 14 px или любую используемую вами шкалу дизайн-системы.
Таблица распространенных значений сопоставляет размеры, к которым чаще всего обращаются дизайнеры — так что вопросы вроде "сколько будет 24px в rem" получают ответ с первого взгляда. Инструмент бесплатный, обновляется по мере ввода и является незаменимым помощником для преобразования макетов с фиксированными пикселями в доступный, масштабируемый CSS на основе rem.
Как использовать Конвертер пикселей в EM/REM
- Введите значение для преобразования и выберите его единицу: px, rem, em, pt или %.
- Скорректируйте размер шрифта корневого элемента (для rem) и размер шрифта родительского элемента (для em и %), если они отличаются от 16 px.
- Прочитайте преобразованные значения в живой таблице.
- Скопируйте сгенерированный фрагмент CSS или любое значение из таблицы распространенных значений.