zoom in effect card

A responsive card featuring an eye-catching scenic image, designed with Tailwind CSS. This component includes hover effects for the image.

This tailwind example is contributed by Anum Shahana, on 16-Oct-2024. Component is made with Tailwind v3.4. It is responsive.

Card

Author Anum Shahana

Tailwind v3.4 3.1k 6

Fork Fullscreen

Related Examples

component

pablitodgb

1 year ago

1.7k
Cards

Morris Muriuki Muthigani

1 year ago

1.8k
beautifull feature section
We create a Advance animated feature section using tailwindcss and custom css

Akram Khan

2 years ago

3.2k
Tailwind Card Components
A collection of 20+ copy-paste ready card components built with pure HTML and Tailwind CSS. Includes product cards, profile cards, article cards, pricing cards, testimonials, and notifications.

Ijila Itunu

1 year ago

1.4k
Portfolio with buttons
Portfolio with buttons. Portfolio item has image, title and description.

Mike Varen

2 years ago

4.8k
DevPort
modern portifolio by salvator

Baraka Salvator

1 year ago

1.7k
Modern E-commerce Product Card with TailwindCSS
This product card is designed for e-commerce platforms using TailwindCSS. It features a discount badge, product image carousel, quick view and quick order buttons, ratings, product name, brand details, dynamic pricing with a strike-through original price, and a prominent add-to-cart button. The clean and professional layout is perfect for showcasing products on online stores.

SHARIFUL ISLAM

1 year ago

3k
Cards - Users Card
This Users Card design includes: 1. Responsive layout using Flexbox 2. Indigo-800 and Blue-900 color scheme 3. Dark mode support 4. User list with avatars, names, and roles 5. Hover effects on user items 6. "Add Member" button 7. Card footer with team member count 8. Subtle animations and transitions 9. Accessibility considerations (proper heading structure, color contrast) Key features: - The background uses a gradient from Indigo-800 to Blue-900 - The card has a white background in light mode and dark gray in dark mode - Text colors are adjusted for readability in both light and dark modes - User avatars have a border color that changes in dark mode - User items have a hover effect that scales them slightly - The "Add Member" button uses Indigo-800 with a Blue-900 hover state - Dark mode is automatically applied based on system preferences - The entire card fades in on load for a smooth entrance - The card has a hover effect that enhances its shadow This design provides a clean, professional look for displaying team members while incorporating the requested color scheme and maintaining good usability across different devices and color modes.

nejaa badr

2 years ago

2.7k
Card 30/70

Maxim

1 year ago

1.7k
Gradient card

TailwindFlex

3 years ago

10.5k
IMDB score and votes box

Darius G

3 years ago

9.1k
User Card

Md. Tofayel islam

1 year ago

2k