Cards
Use these responsive card components to show data entries and information to your users in multiple forms and contexts such as for your blog, application, user profiles, and more.Default card
Use the following simple card component with a title and description. Notice the `href` prop set, as that card is one big `a` element.Card with action button
Use the following example of a card element if you also want to have an action button.Noteworthy technology acquisitions 2021
Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.
Card with link
This example can be used to show a CTA as a link instead of a button inside the card.Need a help in Claim?
Go to this step by step guideline process on how to certify for your weekly benefits:
See our guidelineCard with image
Userreverse=true to reverse the position of an image.
You can use the following example of a card element with an image for blog posts, user cards, and many more. 
Noteworthy technology acquisitions 2021
Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.
Horizontal card
If you want to spice up your cards you can use the following card which has its child elements aligned horizontally.User profile card
Use this user profile card example if you want to show a dropdown menu and buttons to enable multiple actions from your user.
Bonnie Green
Visual DesignerCard with form inputs
Use this card example where you can add form input elements that can be used for authentication actions or any other context where you need to receive information from your users.E-commerce card
Use this card for your e-commerce websites and show information about the products and enable actions such as adding a review and adding the product to the cart.
Call to action card
Use this CTA card example to encourage your users to visit a certain page such as downloading the iOS or Android application for your project.Work fast from anywhere
Stay up to date and move work forward with Flowbite on iOS & Android. Download the app today.
Card with list
Use this card example if you want to show a list of data:Latest Customers
View all
Neil Sims
email@windster.com
$320
Bonnie Green
email@windster.com
$3467-
Michael Gough
email@windster.com
$67
Pricing card
Show detailed information to potential customers about your product’s pricing plan, list of features, and a purchase button.Standard plan
- 2 team members
- 20GB Cloud storage
- Integration help
- Sketch Files
- API Access
- Complete documentation
- 24×7 phone & email support
Testimonial card
Use this example to split cards into multiple sections such as for testimonials or reviews.Very easy this was to integrate
If you care for your time, I hands down would go with this."
Solid foundation for any project
Designing with Figma components that can be easily translated to the utility classes of Tailwind CSS is a huge timesaver!"
Mindblowing workflow
Aesthetically, the well designed components are beautiful and will undoubtedly level up your next application."
Efficient Collaborating
You have many examples that can be used to create a fast prototype for your team."
