Калькулятор співвідношення сторін

Обчислюйте співвідношення сторін, пропорційно змінюйте розміри та отримуйте значення CSS aspect-ratio

16:9
1.7778

Пропорційна зміна розміру

aspect-ratio: 16 / 9;

Калькулятор співвідношення сторін

Обчислюйте співвідношення сторін, пропорційно змінюйте розміри та отримуйте значення CSS aspect-ratio

Можливості

  • Обчисліть співвідношення сторін з будь-якої ширини та висоти
  • Пропорційна зміна розміру — введіть нову ширину або висоту, щоб автоматично обчислити іншу
  • Передустановки поширених співвідношень (16:9, 4:3, 1:1, 21:9 тощо)
  • Візуальний попередній перегляд співвідношення сторін
  • Вивід значення властивості CSS aspect-ratio
  • Міняйте розміри місцями одним кліком
  • Обробка на 100 % на стороні клієнта

Як використовувати

  1. Введіть ширину та висоту, щоб обчислити співвідношення сторін.
  2. Або натисніть кнопку передустановленого співвідношення.
  3. Використовуйте розділ «Пропорційна зміна розміру», щоб знайти нові розміри.
  4. Скопіюйте значення CSS aspect-ratio для своїх таблиць стилів.

Поради та найкращі практики

  • Використовуйте 16:9 для стандартного відео та презентацій.
  • Використовуйте 1:1 для аватарок у соцмережах і дописів в Instagram.
  • Властивість CSS aspect-ratio підтримується в усіх сучасних браузерах.

Запитання та відповіді

Що таке співвідношення сторін?

Співвідношення сторін — це пропорційне відношення між шириною та висотою. Наприклад, 16:9 означає, що на кожні 16 одиниць ширини припадає 9 одиниць висоти.

Яке співвідношення сторін найкраще для відео?

16:9 — стандарт для HD-відео та більшості екранів. 21:9 використовується для надширокого/кінематографічного контенту. 9:16 — стандарт для вертикального/мобільного відео.

Як працює пропорційна зміна розміру?

Введіть нову ширину або нову висоту, і калькулятор обчислить інший вимір, щоб зберегти те саме співвідношення сторін — без розтягування чи спотворення.