List
The List is used to create a List
| Prop | Description | Value(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
Mary JaneDiscover how to use FunUI's utility classes to create responsive layouts and consistent spacing with ease.
John DoeExplore built-in components like buttons, cards, modals, and how to use them to build clean UIs quickly.
Johnson MichealLearn how to customize FunUI with your own themes and integrate animations for a better user experience.
#
Stripped List
Displaying a simple stripped List
React / Next.js
Mary JaneDiscover how to use FunUI's utility classes to create responsive layouts and consistent spacing with ease.
John DoeExplore built-in components like buttons, cards, modals, and how to use them to build clean UIs quickly.
Johnson MichealLearn how to customize FunUI with your own themes and integrate animations for a better user experience.
#
Bordered List
Displaying a simple bordered List
React / Next.js
- Courses
- Social media marketing
- Programming
- Web Development
- Web Design
- Animation
#
Dark Mode List
Displaying a simple stripped List in dark mode
React / Next.js
- Courses
- HTML
- CSS
- FUN CSS
- JAVASCRIPT