The letter-spacing CSS property sets the spacing behavior between text characters.


/* Keyword value */
letter-spacing: normal;

/* <length> values */
letter-spacing: 0.3em;
letter-spacing: 3px;
letter-spacing: .3px;

/* Global values */
letter-spacing: inherit;
letter-spacing: initial;
letter-spacing: unset;


The normal letter spacing for the current font. Unlike a value of 0, this keyword allows the user agent to alter the space between characters in order to justify text.
Specifies extra inter-character space in addition to the default space between characters. Values may be negative, but there may be implementation-specific limits. User agents may not further increase or decrease the inter-character space in order to justify text.

Formal syntax

normal | <length>



<p class="normal">letter spacing</p>
<p class="em-wide">letter spacing</p>
<p class="em-wider">letter spacing</p>
<p class="em-tight">letter spacing</p>
<p class="px-wide">letter spacing</p>


.normal   { letter-spacing: normal; }
.em-wide  { letter-spacing: 0.4em; }
.em-wider { letter-spacing: 1em; }
.em-tight { letter-spacing: -0.05em; }
.px-wide  { letter-spacing: 6px; }


Accessibility concerns

A large positive or negative letter-spacing value will make the word(s) the styling is applied to unreadable. For text styled with a very large positive value, the letters will be so far apart that the word(s) will appear like a series of individual, unconnected letters. For text styled with a very large negative value, the letters will overlap each other to the point where the word(s) may be unrecognizable.

Legible letter-spacing must be determined on a case-by-case basis, as different font families have different character widths. There is no one value that can ensure all font families automatically maintain their legibility.


Specification Status Comment
CSS Text Module Level 3
The definition of 'letter-spacing' in that specification.
Working Draft No change.
CSS Transitions
The definition of 'letter-spacing' in that specification.
Working Draft Defines letter-spacing as animatable.
CSS Level 2 (Revision 1)
The definition of 'letter-spacing' in that specification.
Recommendation No change.
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
The definition of 'letter-spacing' in that specification.
Recommendation Initial SVG definition.
CSS Level 1
The definition of 'letter-spacing' in that specification.
Recommendation Initial definition.
Initial valuenormal
Applies toall elements. It also applies to ::first-letter and ::first-line.
Computed valuean optimum value consisting of either an absolute length or the keyword normal
Animation typea length
Canonical orderthe unique non-ambiguous order defined by the formal grammar

Browser compatibility

Update compatibility data on GitHub
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
letter-spacingChrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 4Opera Full support 3.5Safari Full support 1WebView Android Full support 37Chrome Android Full support 18Firefox Android Full support 4Opera Android ? Safari iOS ? Samsung Internet Android ?
SVG supportChrome Full support YesEdge Full support 12Firefox No support NoIE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android No support NoOpera Android ? Safari iOS ? Samsung Internet Android ?


Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown

See also