<div class="saiyan-vertical-card"> <img class="card__img" src="https://assets.myntassets.com/h_1440,q_90,w_1080/v1/assets/images/10807752/2019/11/1/343806dd-9194-4142-a930-060b851c8b551572588206480-PRINTOCTOPUS-Men-Tshirts-1101572588204523-1.jpg" alt="image" /> <div class="card__body"> <h3 class="card__heading">Free Authority</h3> <h4 class="card__subtext">Dragon Ball Z</h4> <div class="card__price__container"> <span class="card__price">Rs. 599</span> <span class="card__price__stricked">Rs. 1499</span> <span class="card__price__discount">(60% OFF)</span> </div> <div class="card__actions"> <a class="card__btn card__btn__secondary" href="#" ><i class="fa-solid fa-cart-arrow-down"></i> Add to Cart</a > <div class="card__like__btn"> <div class="card__badge card__icon__badge"> <span class="card__badge__icon" ><i class="fa-regular fa-heart"></i ></span> </div> <div class="ratings"> <span>4.3 <i class="fa-solid fa-star ratings__icon"></i> | 1.1k</span> </div> </div> </div> </div> </div> <div class="saiyan-vertical-card"> <img class="card__img" src="https://assets.myntassets.com/h_1440,q_90,w_1080/v1/assets/images/10807752/2019/11/1/343806dd-9194-4142-a930-060b851c8b551572588206480-PRINTOCTOPUS-Men-Tshirts-1101572588204523-1.jpg" alt="image" /> <div class="card__body"> <h3 class="card__heading">Free Authority</h3> <h4 class="card__subtext">Dragon Ball Z</h4> <div class="card__price__container"> <span class="card__price">Rs. 599</span> <span class="card__price__stricked">Rs. 1499</span> <span class="card__price__discount">(60% OFF)</span> </div> <div class="card__actions"> <a class="card__btn card__btn--primary" href="#" ><i class="fa-solid fa-cart-arrow-down"></i> Go to Cart</a > <div class="card__like__btn"> <div class="card__badge card__icon__badge"> <span class="card__badge__icon" ><i class="fa-solid fa-heart"></i ></span> </div> <div class="ratings"> <span>4.3 <i class="fa-solid fa-star ratings__icon"></i> | 1.1k</span> </div> <div class="card__popularity__badge__container"> <span class="card__popularity__badge">New Season</span> </div> </div> </div> </div> </div> <div class="saiyan-vertical-card"> <img class="card__img" src="https://assets.myntassets.com/h_1440,q_90,w_1080/v1/assets/images/10807752/2019/11/1/343806dd-9194-4142-a930-060b851c8b551572588206480-PRINTOCTOPUS-Men-Tshirts-1101572588204523-1.jpg" alt="image" /> <div class="card__body"> <h3 class="card__heading">Free Authority</h3> <h4 class="card__subtext">Dragon Ball Z</h4> <div class="card__price__container"> <span class="card__price">Rs. 599</span> <span class="card__price__stricked">Rs. 1499</span> <span class="card__price__discount">(60% OFF)</span> </div> <div class="card__actions"> <a class="card__btn card__btn--primary" href="#" ><i class="fa-solid fa-cart-arrow-down"></i> Move to Cart</a > <div class="card__close__btn__container"> <span class="card__close__btn"><i class="fa-solid fa-xmark"></i></span> </div> </div> </div> </div>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter