first-letter pseudo-element

The first-letter pseudo-element allows you to style the first letter of a text in an element.

Syntax

selector::first-letter {
	
}

Let's apply styles to the first letters of each paragraph:

<p>
	Lorem ipsum dolor sit amet.
</p>
<p>
	Lorem ipsum dolor sit amet.
</p>
<p>
	Lorem ipsum dolor sit amet.
</p>

p::first-letter {
	color: red;
	font-size: 27px;
}