Online Tool Store
Предпросмотр Межбуквенного Интервала
Просматривайте межбуквенный интервал в px, em или rem с настройками шрифта, начертания и трансформации текста, затем копируйте готовый CSS. Работает в браузере.
Этот инструмент работает полностью в вашем браузере. Ваши файлы никогда не загружаются на сервер.
Как работает предпросмотр межбуквенного интервала
- Введите текст для предпросмотра и настройте межбуквенный интервал, размер шрифта, начертание, гарнитуру и трансформацию текста.
- Переключайте единицу интервала между em, px и rem в соответствии с тем, как написана таблица стилей вашего проекта.
- Наблюдайте, как обновляется живой предпросмотр при перетаскивании ползунка интервала.
- Скопируйте итоговые CSS-объявления в свою таблицу стилей или нажмите «Сбросить», чтобы начать заново.
Часто задаваемые вопросы
Для чего используется letter-spacing?
Чтобы регулировать расстояние между символами (трекинг), улучшая читаемость, выделяя заголовки или добиваясь определённого типографического стиля, например широко расставленных подписей заглавными буквами.
Какой типичный диапазон значений letter-spacing?
Небольшие отрицательные значения (например, -0.02em) уплотняют крупный текст, а положительные значения (от 0.05em до 0.2em) обычно используют для подписей заглавными буквами и значков. Очень широкий интервал (0.3em и больше) применяют для стилистического акцента.
Влияет ли насыщенность шрифта на внешний вид letter-spacing?
Да - более жирные начертания имеют естественно более широкие формы символов, поэтому одно и то же значение letter-spacing может выглядеть плотнее или свободнее в зависимости от выбранной насыщенности и размера.
Можно ли скопировать CSS прямо в свой проект?
Да - сгенерированные объявления letter-spacing, font-size, font-weight, font-family и text-transform готовы для вставки в вашу таблицу стилей.
В каких единицах указывать letter-spacing: px, em или rem?
em - самый распространённый выбор, потому что он масштабируется вместе с собственным font-size элемента, поэтому трекинг остаётся пропорциональным при изменении размера текста. rem масштабируется с корневым размером шрифта, что удобно, если нужен одинаковый интервал при разных размерах. px самый предсказуемый, но вообще не масштабируется. Этот инструмент позволяет просмотреть и скопировать все три варианта.
Какой letter-spacing лучше всего подходит для текста заглавными буквами?
Подписи и кнопки заглавными буквами обычно читаются лучше с чуть более широким трекингом (примерно от 0.05em до 0.15em), компенсируя плотное расположение заглавных букв. Используйте настройку трансформации текста, чтобы посмотреть предпросмотр заглавными буквами перед выбором значения.
Как мы выглядим на фоне других
| Feature | Online Tool Store | Калькуляторы letter-spacing | Инструменты конвертации единиц |
|---|---|---|---|
| Живой предпросмотр с ползунком | ✓ | ✓ | ✗ |
| Переключение единиц em / px / rem с корректной конвертацией | ✓ | ✗ | ✓ |
| Выбор гарнитуры в живом предпросмотре | ✓ | ✗ | ✗ |
| Предпросмотр трансформации текста (заглавные/строчные/с заглавной буквы) | ✓ | ✗ | ✗ |
| Мгновенно копируемый CSS | ✓ | ✓ | ✓ |
Удобно для подбора точного значения трекинга для заголовка или подписи кнопки перед тем, как записать его в CSS.