Product card · Apple
A shop product card with CSS-drawn product art, price with compare-at discount, rating, colour swatches, a wishlist heart and an add-to-cart button that confirms.
Design · Apple2 / 20
App Store style tile: rounded media inset, translucent blur wishlist button, red sale pill and a 12 px radius filled 'Add to cart' button.
Motion
The card lifts into place and its details follow one after another, 55 ms apart.
Accent
A shop product card with CSS-drawn product art, price with compare-at discount, rating, colour swatches, a wishlist heart and an add-to-cart button that confirms.
productshopecommercecardpriceratingswatcheswishlistcart