April 2025

Adding Sequential Numbers with the CSS Counter Increment Property

An example of displaying sequential numbers without the need to write JavaScript

You can use the counter-increment property in CSS to display numbers in sequence. With this feature, it’s possible to display using Roman numerals, letters (uppercase or lowercase), or regular digits. This property is commonly used for numbering subheadings, but you can also use it to add numbers to carousel navigation dots.

If you want to add numbers to carousel navigation dots, you can add them sequentially as shown in the example below.