Что это такое
Конвертер CM в VH — это инструмент, который переводит физические сантиметры в относительную CSS-единицу viewport height (высоту окна браузера). Простыми словами, он помогает понять, сколько процентов от высоты экрана займёт элемент, если вы привыкли мыслить в привычных «земных» миллиметрах и сантиметрах. Это особенно полезно при адаптивной вёрстке, где размеры должны масштабироваться под разные устройства, а не оставаться статичными пикселями.
Как пользоваться
Работа с инструментом занимает меньше минуты:
- Введите в первое поле числовое значение в сантиметрах (например,
5или12.5). - Выберите пресет устройства из выпадающего списка — от смартфона до 4K-монитора. Можно задать собственные параметры viewport вручную.
- Нажмите кнопку «Конвертировать» — калькулятор мгновенно покажет результат в единицах vh.
- Скопируйте готовое CSS-значение (например,
7.5vh) и вставьте его прямо в свой код или макет. - При необходимости повторите операцию для других значений — конвертер работает как обычный калькулятор vh.
Кому и когда пригодится
Инструмент будет полезен веб-разработчикам и верстальщикам, которые хотят точно рассчитать высоту блоков под конкретный экран. Например, при создании hero-секций, полноэкранных слайдеров или модальных окон, где важна пропорция относительно видимой области.
Также конвертер пригодится дизайнерам, работающим в Figma или Sketch: макеты часто задаются в сантиметрах или миллиметрах, а перенести их в адаптивную вёрстку без пересчёта сложно. Инструмент помогает быстро получить CSS-конвертер единиц и избежать ошибок на стыке «дизайн — код».
Наконец, конвертер cm в vh будет удобен всем, кто изучает CSS-единицы и хочет на практике понять, как физические размеры соотносятся с относительными величинами в браузере.
Плюсы и ограничения
Плюсы:
- Мгновенный пересчёт с учётом реальной высоты viewport.
- 12 встроенных пресетов популярных устройств (iPhone, iPad, ноутбуки и т.д.).
- Поддержка дробных значений — можно вводить не только целые сантиметры.
- Копирование готового CSS-значения в один клик.
- Полностью бесплатный онлайн-инструмент без регистрации.
Ограничения:
- Результат зависит от выбранного viewport: при смене устройства значение vh изменится.
- Не учитывает динамические элементы браузера (например, мобильные панели адреса).
- Работает только с высотой окна, для ширины нужен отдельный конвертер (например, в vw).
Частые вопросы
Почему результат меняется при выборе другого устройства?
Потому что viewport height — это относительная единица, равная 1% от текущей высоты окна браузера. У смартфона и десктопа разная высота в пикселях, поэтому и один сантиметр будет занимать разное количество vh. Именно поэтому важно выбирать пресет под целевую аудиторию.
Можно ли использовать конвертер для ширины экрана?
Нет, этот инструмент заточен исключительно под высоту. Для перевода сантиметров в проценты ширины используйте аналогичный конвертер в vw (viewport width).
Что делать, если моего устройства нет в списке пресетов?
Ничего страшного — вы можете вручную указать высоту viewport в пикселях в специальном поле. Конвертер мгновенно пересчитает значение с учётом ваших параметров.
Влияет ли плотность пикселей экрана на расчёт?
Нет. CSS-единицы vh всегда считаются от CSS-высоты окна, которая не зависит от физического разрешения или плотности пикселей. Поэтому результат будет одинаковым для Retina- и обычных дисплеев.
Это работает только для высоты элементов или можно переводить отступы?
Подойдёт для любых CSS-свойств, где используется высота: height, min-height, max-height, а также для вертикальных отступов padding и margin. Просто подставьте полученное значение в нужное свойство.