Генератор плинного розміру шрифту
Обчисліть реальне плинне значення CSS clamp() з мінімального та максимального розміру за двох ширин вʼюпорта — зі слоупом і перетином, показаними покроково, та живим превʼю зміни розміру.
Результат
Ця сторінка відкриває калькулятор із уже заповненим універсальним налаштуванням плинного розміру шрифту: 16px за вʼюпорта 320px і до 24px за вʼюпорта 1280px. Це зручний діапазон від основного тексту до дещо більшого, який плавно масштабується від типового екрана телефона до типового вікна десктопа, — саме те, що більшість людей мають на увазі, шукаючи плинний clamp() для розміру шрифту.
Усі чотири числа можна змінити: підніміть максимальний розмір для заголовка замість основного тексту або звузьте діапазон вʼюпорта, якщо дизайну потрібно гнутися лише між планшетом і десктопом. Що б ви не ввели, слоуп і перетин осі Y перераховуються так само і показуються як явна арифметика, а не сховані всередині кінцевого рядка.
Під чотирма полями повзунок ширини вʼюпорта керує живим превʼю, тож масштабування видно одразу, а готовий рядок clamp() — за один клік. Перемикання одиниці результату між rem і px перераховує кожне число, не чіпаючи самі значення мінімального й максимального розміру.