AI Prompt Library
Ready-to-use prompts for HTML, React, 3D scroll animations, and more. Every thumbnail below is a live render of the exact code behind it — copy the prompt into any AI to get that same result.
Product Card with Hover Zoom
Build a product card where the product image slowly zooms in on hover (overflow hidden on the container), revealing a quick 'Add to Cart' button that fades in over the bottom of the image.
Slide-in Cart Drawer
Create a shopping cart drawer that slides in from the right edge of the screen over a dimmed backdrop, listing line items with quantity steppers and a sticky checkout button at the bottom.
Quick View Product Modal
Build a 'Quick View' modal that opens from a product card click, showing a larger image on one side and details/price/add-to-cart on the other, without navigating away from the listing page.
Size Selector Chips
Create a row of size-selection chips (S, M, L, XL) where the selected chip gets a solid gradient background and the others stay outlined, with unavailable sizes shown struck-through and disabled.
Add-to-Cart Success Bounce
Animate an 'Add to Cart' button so that on click it briefly shows a checkmark with a bounce/scale animation, then a small cart-icon badge count increments with a pop effect.
Wishlist Heart Toggle
Create a heart icon button that fills in with a pink color and a quick scale-pulse animation when clicked to add an item to a wishlist, reverting smoothly when clicked again.
Sticky Add-to-Cart Bar
Build a slim product summary bar that becomes fixed to the bottom of the screen once the user scrolls past the main product image, showing name, price, and an Add to Cart button.