Previzualizator Spațiere Litere
Previzualizează spațierea dintre litere în px, em sau rem cu control asupra fontului, grosimii și transformării, apoi copiază CSS-ul exact. Rulează în browser.
Acest instrument rulează în întregime în browserul tău. Fișierele tale nu sunt niciodată încărcate pe un server.
Cum funcționează previzualizatorul de spațiere a literelor
- Introduceți textul de previzualizare și ajustați spațierea literelor, dimensiunea fontului, grosimea, familia de fonturi și transformarea textului.
- Comutați unitatea de spațiere între em, px și rem, potrivit cu modul în care este scrisă foaia de stiluri a proiectului dumneavoastră.
- Urmăriți cum se actualizează previzualizarea live pe măsură ce trageți cursorul de spațiere.
- Copiați declarațiile CSS rezultate în foaia de stiluri sau apăsați Resetare pentru a o lua de la capăt.
Întrebări frecvente
La ce este folosit letter-spacing?
Pentru a ajusta spațiul dintre caractere (tracking), pentru a îmbunătăți lizibilitatea, a evidenția titlurile sau a obține un stil tipografic specific, precum etichete cu majuscule și spațiere largă.
Care este un interval tipic pentru letter-spacing?
Valorile negative mici (precum -0.02em) strâng textul mare de afișaj, iar valorile pozitive (0.05em până la 0.2em) sunt comune pentru etichete cu majuscule și insigne. Spațierea foarte largă (0.3em sau mai mult) este folosită pentru accent stilistic.
Grosimea fontului afectează aspectul letter-spacing?
Da - grosimile mai accentuate au forme de caractere în mod natural mai late, astfel încât aceeași valoare letter-spacing poate părea mai strânsă sau mai largă în funcție de grosimea și dimensiunea alese.
Pot copia CSS-ul direct în proiectul meu?
Da - declarațiile generate pentru letter-spacing, font-size, font-weight, font-family și text-transform sunt gata de lipit în foaia de stiluri.
letter-spacing ar trebui exprimat în px, em sau rem?
em este alegerea cea mai obișnuită deoarece se scalează odată cu font-size propriu al elementului, astfel încât tracking-ul rămâne proporțional dacă textul este redimensionat. rem se scalează cu dimensiunea fontului rădăcină, util atunci când doriți o spațiere consecventă la dimensiuni diferite. px este cel mai previzibil, dar nu se scalează deloc. Acest instrument vă permite să previzualizați și să copiați oricare dintre cele trei.
Ce letter-spacing funcționează cel mai bine pentru text cu majuscule?
Etichetele și butoanele cu majuscule se citesc de obicei mai bine cu un tracking puțin mai larg (aproximativ 0.05em până la 0.15em), pentru a compensa așezarea strânsă a literelor mari. Folosiți controlul de transformare a textului pentru a previzualiza cu majuscule înainte de a alege o valoare.
Cum ne comparăm
| Feature | Online Tool Store | Calculatoare de letter-spacing | Instrumente de conversie a unităților |
|---|---|---|---|
| Previzualizare live cu cursor | ✓ | ✓ | ✗ |
| Comutare unități em / px / rem cu conversie corectă | ✓ | ✗ | ✓ |
| Selector de familie de fonturi în previzualizarea live | ✓ | ✗ | ✗ |
| Previzualizare transformare text (majuscule/minuscule/literă mare la început) | ✓ | ✗ | ✗ |
| CSS copiabil instantaneu | ✓ | ✓ | ✓ |
Util pentru a stabili valoarea exactă de tracking pentru un titlu sau o etichetă de buton înainte de a o scrie în CSS.