Перегляд Міжлітерного Інтервалу
Переглядайте міжлітерний інтервал у 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.