CSS font-variant-caps

The font-variant-caps property in CSS allows you to control the appearance of the capital letters in text. It can be used to convert the capital letters to either small caps or all caps.

There are four possible values for the font-variant-caps property:

• normal: The text is displayed with normal capitalization.
• small-caps: The text is displayed with smaller capital letters.
• all-small-caps: The text is displayed with all small caps.
• all-scroll-caps: The text is displayed with all capital letters.

Let's see some examples to better understand how font-variant-caps works:

In this example, we have set the font-variant-caps property to small-caps. As a result, the text "Lorem Ipsum Dolor Sit Amet" is displayed with smaller capital letters.

Now, we have set the font-variant-caps property to all-small-caps. As a result, the text is displayed with all small caps.

Lastly, setting the font-variant-caps property to all-scroll-caps will display the text with all capital letters.