List
The List is used to create a List
PropDescriptionValue(s)
`gap`To give spaces between elements in the list`Number`
`stripped`To add zebra strips to your List`Boolean`
`bordered`Add a border to your list`Boolean`
`hoverable`Add hoverable effect to list items`Boolean`
`light`Creates a light theme`Boolean`
`dark`Creates a dark theme`Boolean`
`roundItems`Creates a border radius on your list items`Boolean`
#
Simple List
Displaying a simple List
React / Next.js
🔒
https://localhost:3000/preview

Loading preview...

  • Mary Jane
    Discover how to use FunUI's utility classes to create responsive layouts and consistent spacing with ease.
  • John Doe
    Explore built-in components like buttons, cards, modals, and how to use them to build clean UIs quickly.
  • Johnson Micheal
    Learn how to customize FunUI with your own themes and integrate animations for a better user experience.
Loading...
localhost:3000
#
Stripped List
Displaying a simple stripped List
React / Next.js
🔒
https://localhost:3000/preview

Loading preview...

  • Mary Jane
    Discover how to use FunUI's utility classes to create responsive layouts and consistent spacing with ease.
  • John Doe
    Explore built-in components like buttons, cards, modals, and how to use them to build clean UIs quickly.
  • Johnson Micheal
    Learn how to customize FunUI with your own themes and integrate animations for a better user experience.
Loading...
localhost:3000
#
Bordered List
Displaying a simple bordered List
React / Next.js
🔒
https://localhost:3000/preview

Loading preview...

  • Courses
  • Social media marketing
  • Programming
  • Web Development
  • Web Design
  • Animation
Loading...
localhost:3000
#
Dark Mode List
Displaying a simple stripped List in dark mode
React / Next.js
🔒
https://localhost:3000/preview

Loading preview...

  • Courses
  • HTML
  • CSS
  • FUN CSS
  • JAVASCRIPT
Loading...
localhost:3000