Калькулятор PX в REM и CSS clamp()
Мгновенный перевод пикселей в относительные единицы REM и генерация формулы плавной адаптивной типографики clamp() без медиа-запросов.
По умолчанию в современных браузерах равен 16px
Генератор плавной типографики CSS clamp():
✓ Скопировано!
font-size: clamp(1rem, 0.7359rem + 1.1268vw, 1.75rem);
Эталонная шкала типографики (Tailwind CSS):
| Класс Tailwind | Пиксели (PX) | Значение (REM) | Копировать |
|---|
Почему важно использовать REM вместо PX
Доступность (WCAG)
Пользователи со слабым зрением увеличивают базовый шрифт в браузере. Единицы REM автоматически масштабируют текст, а жесткие PX ломают верстку.
Адаптивность clamp()
Формула clamp() устраняет необходимость писать десятки @media-правил под смартфоны, планшеты и мониторы.
Совместимость с Tailwind
Современные CSS-фреймворки (Tailwind, Bootstrap 5) компилируют классы text-* и p-* строго в rem-единицах.
Связанные инструменты и утилиты
SQL Форматировщик и валидатор
Форматирование SQL-запросов, настройка отступов, минификация для PostgreSQL, MySQL, ClickHouse без отправки на сервер.
Проверка контрастности цветов (WCAG 2.2)
Проверка коэффициента контраста текста и фона по стандартам WCAG 2.2 (AA / AAA), живой предпросмотр компонентов и палитр.
Генератор надежных паролей
Криптостойкие пароли повышенной надежности на базе Web Crypto API локально на устройстве без передачи в сеть.
JWT Декодер и инспектор токенов
Безопасная локальная расшифровка JSON Web Token (JWT): Header, Payload, проверка сроков жизни exp/iat без утечек.
Тестер регулярных выражений (Regex)
Интерактивная проверка регулярных выражений с подсветкой совпадений, разбором групп, флагами и готовой шпаргалкой.
Генератор градиентов CSS & Tailwind
Визуальный конструктор градиентов с настройкой углов, трендовыми палитрами и копированием чистого CSS и классов Tailwind.