CSS nth-child Playground

Enter a rule or click items to select them. The rule updates automatically.

CSS rule

Quick rules

Every nth item:
First/last:
Complex rules:

Preview

20
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

How it works:

How to use: Type an nth-child rule or click items to select them

Interactive: Clicking items updates the rule automatically and deselects presets