Card

    @import url("https://openui.netlify.app/pages/components/Card/card.css");
    <link rel="stylesheet" 
    href="https://openui.netlify.app/pages/components/Card/card.css">
            

Responsive Card

Harry Potter and the Sorcerer's Stone

by J.K Rowling

Harry Potter's life is miserable. His parents are dead and he's stuck with his heartless relatives, who force him to live in a tiny closet under the stairs. But his fortune changes when he receives a letter...

₹237 ₹499

    <div class="card card-hz">
        <img src="..." alt="" class="cover" />
        <button class="card-icon">
            <img src="..." alt="" />
        </button>
        <div class="card-text">
            <a href="">
                <div class="card-heading">
                    Harry Potter and the Sorcerer's Stone
                </div>
            </a>
            <div class="card-sub-heading">by J.K Rowling</div>
            <div class="card-para">Harry Potter's life is...</div>
            <div class="card-price">
                <span class="price">₹237</span>
                <span class="price-original">₹499</span>
            </div>
        </div>
    </div>