letter-spacing

letter-spacing specifies the spacing between characters. A positive number for this value increases the gap between characters, and a negative number decreases the gap between characters.

Initial Value normal
Applies to All elements, including ::first-letter and ::first-line
Inheritance no
Animation length value

The letter-spacing property sets the character spacing within an item. Usually, character spacing is set by browsers based on font type and type, font size, and operating system settings. This property is intended to change this value. It is acceptable to use a negative value, but in this case, you should ensure that the text’s readability is preserved.

Syntax

/* length values */

letter-spacing: 0.1em;
letter-spacing: 5px;
letter-spacing: .2px;

/* Keyword values */

letter-spacing: normal;

/* Global values */

letter-spacing: inherit;
letter-spacing: initial;
letter-spacing: unset;

Description

valuewhat it does
normalDefault value. The browser sets the spacing between characters.
lengthSets the extra spacing between characters, given in CSS length units – pixels (px), centimeters (cm), points (pt), etc. It is allowed to use negative values.
inheritThe value is inherited from the parent element.
initialSets the default value.

Example

letter-spacing: normal;

Praesent lacinia sollicitudin neque, at cursus nisi mollis finibus. Aenean sed rutrum metus. Integer facilisis risus et eros rhoncus laoreet. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

letter-spacing: 0.2em;

Praesent lacinia sollicitudin neque, at cursus nisi mollis finibus. Aenean sed rutrum metus. Integer facilisis risus et eros rhoncus laoreet. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

letter-spacing: -2px;

Praesent lacinia sollicitudin neque, at cursus nisi mollis finibus. Aenean sed rutrum metus. Integer facilisis risus et eros rhoncus laoreet. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

#letspc_n {
	letter-spacing: normal;
}

#letspc_em {
	letter-spacing: 0.2em;
}

#letspc_px {
	letter-spacing: -2px;
}