Home
Hunter Guru
Form package

Form package

This tailwind example is contributed by Hunter Guru, on 03-May-2024. Component is made with Tailwind CSS v3. It is responsive.

Card

Author Hunter Guru

2.6k

Fork Fullscreen

<div class="border-blue-600 rounded-2xl border  max-w-sm mx-auto"
    style="box-shadow: rgba(45, 50, 130, 0.15) 0px 12px 16px -4px, rgba(45, 50, 130, 0.15) 0px 4px 6px -2px;">
    <div class="pt-6 px-6">
      <div class="flex itmes-center">
          <span class="pr-2">
            <input id="default-checkbox" type="checkbox" value="" class="h-full text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
          </span>
          <h2 class="text-xl font-semibold text-gray-600">Package 1</h2>
      </div>
    </div>      
    <div class="px-6 pt-5 pb-8">
        <h3 class="text-sm font-medium text-gray-900">What's included</h3>
        <ul role="list" class="mt-4 space-y-4">
            <li class="flex space-x-3">
                <div class="flex justify-center items-center rounded-full bg-green-100 h-5 w-5"><svg
                        xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"
                        class="h-3 w-3 flex-shrink-0 text-green-500">
                        <path fill-rule="evenodd"
                            d="M20.707 5.293a1 1 0 010 1.414l-11 11a1 1 0 01-1.414 0l-5-5a1 1 0 111.414-1.414L9 15.586 19.293 5.293a1 1 0 011.414 0z"
                            clip-rule="evenodd"></path>
                    </svg>
                </div>
                <span class="text-sm text-gray-500">5 workspaces</span>
            </li>
            <li class="flex space-x-3">
                <div class="flex justify-center items-center rounded-full bg-green-100 h-5 w-5"><svg
                        xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"
                        class="h-3 w-3 flex-shrink-0 text-green-500">
                        <path fill-rule="evenodd"
                            d="M20.707 5.293a1 1 0 010 1.414l-11 11a1 1 0 01-1.414 0l-5-5a1 1 0 111.414-1.414L9 15.586 19.293 5.293a1 1 0 011.414 0z"
                            clip-rule="evenodd"></path>
                    </svg>
                </div>
                <span class="text-sm text-gray-500">Unlimited testimonials</span>
            </li>
        </ul>
    </div>
</div>

Related Examples

Animated Pizza Menu Grid
A beautiful, interactive pizza product grid featuring smooth 360-degree rotation animations on hover. This free open-source component includes automatic dark mode support, responsive design (mobile, tablet, desktop), and an elegant "Add to Cart" button reveal effect. Built with HTML and Tailwind CSS - no dependencies required. Ideal for restaurant websites, food delivery platforms, e-commerce stores, or any product showcase needing eye-catching interactivity.

Author:
Homayoun

4 months ago

792
Hotel rooms
A simple room overview

Author:
Matti

1 year ago

1.8k
Card kpi Chart
Targetas kpi con graficas

Author:
Raul antonio de la cruz hernandez

4 months ago

749
image

Author:
pablitodgb

8 months ago

537
Personal card
A card to show minimal info for staff member

Author:
farid

1 year ago

1.3k
Blog Author Card

Author:
EliteAI Tools

1 year ago

1.3k
Game Live Score
A live score game layout design perfect for your live scoring application

Author:
Diavox Jerome Soriano

1 year ago

1.2k
Form
form

Author:
Aman kumar

1 year ago

2.2k
Information card

Author:
Samuel Dawson

3 years ago

12.3k
Profile Card
User profile card

Author:
Ajay Thakur

5 months ago

276
Tailwind Flex Component: Responsive Testimonial Section UI
A clean, modern, and fully responsive Testimonial Section built using Tailwind CSS and Flexbox. Ideal for portfolios, agency websites, SaaS landing pages, or any modern UI project. This reusable component includes user images, job titles, and quotes—perfect for showcasing feedback and adding trust to your UI.

Author:
Muhammad Umair Arshad

9 months ago

1.1k
pricing card
This frontend template is designed for a website that provides software services and open-source code to users. It serves as a clean, modern UI for browsing, searching, and downloading open-source projects. Building with HTML, tailwindcss for CSS ,

Author:
Ahmath S.

6 months ago

653

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components