10+ CSS lists (latest collection)

CSS | Updated on
Latest & unique collection of hand-picked free HTML and CSS lists examples with codes. Updated on March 2022
Editor
Example of Ordered Lists Arrrow Cards
Author Mark Boots
Demo & Code
Tech used HTML / CSS
What is this?

Ordered List Arrow Cards

css list style type numeric, cool css lists, css lists examples

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No
Example of Templat Fancy List
Author Fred
Demo & Code
Tech used HTML / CSS / JS
What is this?

Template – Fancy List

css lists without bullets, css list style type icon svg, css lists templates

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No
Example of Featured List Pure Html Css
Author Selim Rana
Demo & Code
Tech used HTML / CSS (SCSS)
What is this?

Featured List pure html css

css list style type image, cool css lists, css list style type numeric

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No
Example of Custom Bullet Points
Author PSR
Demo & Code
Tech used HTML / CSS
What is this?

Custom Bullet Points

how to style list item with css, css list style type icon, list style css codepen

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No
Example of Cards list view
Author Sowmya Seshadri
Demo & Code
Tech used HTML / CSS (SCSS)
What is this?

Cards – ListView

html css list item hover effects, css list style examples, css list item design with css

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No
hover to play
Author Burmese Potato
Demo & Code
Tech used HTML / CSS
What is this?

Pretty Sticky

css list design, css list style type numeric, list style css codepen

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No
hover to play
Author Mark Eriksson
Demo & Code
Tech used HTML / CSS / JS
What is this?

Forbes Leaderboard

html css list item hover effects, css list style type image, list style css codepen

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No
hover to play
Author Daiane Assen
Demo & Code
Tech used HTML / CSS (SCSS)
What is this?

100dayscss #27

cool css lists, html css list item effects, todo list using html css

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No
Example of Css list playground
Author Iresheep
Demo & Code
Tech used HTML / CSS
What is this?

Css List Playground

list style css codepen, css list style type numeric, css lists without bullets

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No
Example of Css only numbered lists with drop shapes
Author Ines Montani
Demo & Code
Tech used HTML / CSS
What is this?

CSS-only numbered lists with “drop” shapes

css list style type numeric, css lists examples, css list item design with css

  • browsers-compatibility: Chrome, Edge, Firefox, Opera, Safari
  • Responsive: Yes
  • Dependencies: No

Subscribe to our Youtube channel for regular tutorial videos on WordPress, Elementor, Web Design & Development, Website & Social Media strategies, etc. We also recommend you to check this “Essential Website Features” article to create a better website.

Hooray! 🎉 Our Ultimate Figma Mega Course is live for you!

Enrol Now
X