Skip to main content
Frontend HeroFrontend Hero

Numbered CSS List Examples

Styled ordered lists with circled numbers and decorative counters.
Click any list to copy the CSS.

  1. 1First item
  2. 2Second item
  3. 3Third item
#1
  1. 1First item
  2. 2Second item
  3. 3Third item
#2
  1. 1First item
  2. 2Second item
  3. 3Third item
#3
  1. 1First item
  2. 2Second item
  3. 3Third item
#4
  1. 1First item
  2. 2Second item
  3. 3Third item
#5
  1. 1First item
  2. 2Second item
  3. 3Third item
#6
  1. 1First item
  2. 2Second item
  3. 3Third item
#7
  1. 1First item
  2. 2Second item
  3. 3Third item
#8
  1. 1First item
  2. 2Second item
  3. 3Third item
#9
  1. 1First item
  2. 2Second item
  3. 3Third item
#10
  1. 1First item
  2. 2Second item
  3. 3Third item
#11
  1. 1First item
  2. 2Second item
  3. 3Third item
#12
  1. 1First item
  2. 2Second item
  3. 3Third item
#13
  1. 1First item
  2. 2Second item
  3. 3Third item
#14
  1. 1First item
  2. 2Second item
  3. 3Third item
#15
  1. 1First item
  2. 2Second item
  3. 3Third item
#16
  1. 1First item
  2. 2Second item
  3. 3Third item
#17
  1. 1First item
  2. 2Second item
  3. 3Third item
#18
  1. 1First item
  2. 2Second item
  3. 3Third item
#19
Frontend Hero

Extract any list style in 2 clicks

Click any element on any website to get its list styles instantly. Frontend Hero gives you 10+ essential developer tools in one browser extension.

Get Frontend Hero now →

Explore more list styles

All ListsMinimalCustom Bullets

Contact Us

Have questions, feedback, or found a bug? Reach out and we'll get back to you within 24 hours.

hello@frontend-hero.com

Team Licenses

Get volume discounts when you equip your team with Frontend Hero.

What you get:

  • Volume discounts for 5+ licenses
  • Manage all licenses from one place
  • Priority support
  • Custom invoicing available

Get in touch:

hello@frontend-hero.com