Card 1
Card title
This is some text within a card body.
<div class="card"> <div class="card-body"> <h5 class="card-title">Card title</h5> <p class="mb-0">This is some text within a card body.</p> </div> </div>
Card 2
Card title
This is some text within a card body.
<div class="card bg-secondary"> <div class="card-body"> <h5 class="card-title">Card title</h5> <p class="mb-0">This is some text within a card body.</p> </div> </div>
Card 3
Cork Admin
Powerful CRM admin dashboard template based on Bootstrap and Sass for all kind of back-end projects.
<div class="card style-5 mb-md-0 mb-4"> <div class="card-top-content"> <div class="avatar avatar-md"> <img alt="avatar" src="assets/img/profile-6.jpeg" class="rounded-circle"> </div> </div> <div class="card-content"> <div class="card-body"> <h5 class="card-title mb-2">Mary McDonald</h5> <p class="card-text">Awesome Project, it has been the perfect fit for my Project</p> <a href="javascript:void(0);" class="text-warning mt-2 d-inline-block">Follow</a> </div> </div> </div>
Card 4
Andy King
It's a really good project, love the design and code quality also have great support.
Follow<!-- Bg Primary --> <div class="card style-5 bg-primary mb-md-0 mb-4"> <div class="card-top-content"> <div class="avatar avatar-md"> <img alt="avatar" src="assets/img/profile-6.jpeg" class="rounded-circle"> </div> </div> <div class="card-content"> <div class="card-body"> <h5 class="card-title mb-2">Mary McDonald</h5> <p class="card-text">Awesome Project, it has been the perfect fit for my Project</p> <a href="javascript:void(0);" class="text-warning mt-2 d-inline-block">Follow</a> </div> </div> </div>
Card 5
<a class="card style-7" href="https://themeforest.net/item/cork-responsive-admin-dashboard-template/25582188" target="_blank"> <img src="./assets/img/tl-2.jpeg" class="card-img-top" alt="..."> <div class="card-footer"> <h5 class="card-title mb-0">Kelly Young</h5> <p class="card-text">Project manager</p> </div> </a>
Card 6
<a class="card style-7" href="https://themeforest.net/item/cork-responsive-admin-dashboard-template/25582188" target="_blank"> <img src="./assets/img/tl-2.jpeg" class="card-img-top" alt="..."> <div class="card-header"> <h5 class="card-title mb-0">Kelly Young</h5> <p class="card-text">Project manager</p> </div> </a>
Card 7
<a class="card style-6" href="javascript:void(0);"> <span class="badge badge-danger"></span> <img src="./assets/img/product-4.jpg" class="card-img-top" alt="..."> <div class="card-footer"> <div class="row"> <div class="col-12 mb-4"> <b>Nikon</b> </div> <div class="col-3"> <div class="badge--group"> <div class="badge badge-primary badge-dot"></div> </div> </div> <div class="col-9 text-end"> <div class="pricing d-flex justify-content-end"> <p class="text-success mb-0">$2100.00</p> </div> </div> </div> </div> </a>
Card 8
<a class="card style-6" href="javascript:void(0);"> <span class="badge badge-danger"></span> <img src="./assets/img/product-4.jpg" class="card-img-top" alt="..."> <div class="card-footer"> <div class="row"> <div class="col-12 mb-4"> <b>Shoes</b> </div> <div class="col-3"> <div class="badge--group"> <div class="badge badge-danger badge-dot"></div> <div class="badge badge-success badge-dot"></div> <div class="badge badge-warning badge-dot"></div> </div> </div> <div class="col-9 text-end"> <div class="pricing d-flex justify-content-end"> <p class="text-success mb-0">$95.00</p> </div> </div> </div> </div> </a>
Card 9
<!-- Sale --> <a class="card style-6 mb-md-0 mb-4" href="javascript:void(0);"> <span class="badge badge-danger">SALE</span> <img src="./assets/img/product-3.jpg" class="card-img-top" alt="..."> <div class="card-footer"> <div class="row"> <div class="col-12 mb-4"> <b>Nike Shoes Green</b> </div> <div class="col-3"> <div class="badge--group"> <div class="badge badge-success badge-dot"></div> <div class="badge badge-secondary badge-dot"></div> <div class="badge badge-warning badge-dot"></div> </div> </div> <div class="col-9 text-end"> <div class="pricing d-flex justify-content-end"> <p class="text-success mb-0 me-2">$1100.00</p> <p class="mb-0 line-through"><del>$2100.00</del></p> </div> </div> </div> </div> </a>
Card 10
<!-- New --> <a class="card style-6" href="javascript:void(0);"> <span class="badge badge-primary">NEW</span> <img src="./assets/img/product-1.jpg" class="card-img-top" alt="..."> <div class="card-footer"> <div class="row"> <div class="col-12 mb-4"> <b>Nike Shoes Red</b> </div> <div class="col-3"> <div class="badge--group"> <div class="badge badge-primary badge-dot"></div> <div class="badge badge-danger badge-dot"></div> <div class="badge badge-info badge-dot"></div> </div> </div> <div class="col-9 text-end"> <div class="pricing d-flex justify-content-end"> <p class="text-success mb-0">$2100.00</p> </div> </div> </div> </div> </a>
Card 11
Elegant and useful Admin Templates on Themeforest
Vanessa Kirby
14 Mar
<div class="card style-2 mb-md-0 mb-4"> <img src="./assets/img/grid-blog-style-2.jpeg" class="card-img-top" alt="..."> <div class="card-body px-0 pb-0"> <h5 class="card-title mb-3">Elegant and useful Admin Templates on Themeforest</h5> <div class="media mt-4 mb-0 pt-1"> <img src="./assets/img/profile-2.jpeg" class="card-media-image me-3" alt=""> <div class="media-body"> <h4 class="media-heading mb-1">Vanessa Kirby</h4> <p class="media-text">14 Mar</p> </div> </div> </div> </div>
Card 12
<div class="card"> <img src="./assets/img/lightbox-3.jpeg" class="card-img-top" alt="..."> <div class="card-body"> <h5 class="card-title mb-3">Card title</h5> <p class="card-text">Some quick example text to build on the card title and card's content.</p> <a href="#" class="btn btn-secondary mt-3">Go somewhere</a> </div> </div>
Card 13
Photography
Elegant and useful Admin Templates on Themeforest
Vanessa Kirby
14 Mar
<div class="card style-3"> <img src="./assets/img/grid-blog-style-2.jpeg" class="card-img-top" alt="..."> <div class="card-body px-0 py-0 align-self-center"> <p class="card-category mb-1">Photography</p> <h5 class="card-title mb-3">Elegant and useful Admin Templates on Themeforest</h5> <div class="media mt-4 mb-0 pt-1"> <img src="./assets/img/profile-2.jpeg" class="card-media-image me-3" alt=""> <div class="media-body"> <h4 class="media-heading mb-1">Vanessa Kirby</h4> <p class="media-text">14 Mar</p> </div> </div> </div> </div>
Card 14
<div class="card"> <div class="card-header"> Card Title </div> <div class="card-body"> <p class="card-text">Ut purus elit, molestie et dignissim ac, maximus sit amet massa. Suspendisse luctus molestie luctus. Curabitur pharetra commodo ornare. Suspendisse cursus leo non magna sollicitudin, in blandit leo euismod. </p> </div> <div class="card-footer"> <div class="row"> <div class="col-6"> <a href="javascript:void(0);" class="btn btn-dark w-100">Cancel</a> </div> <div class="col-6"> <a href="javascript:void(0);" class="btn btn-secondary w-100">Agree</a> </div> </div> </div> </div>
Card 15
<a class="card" href="https://themeforest.net/item/cork-responsive-admin-dashboard-template/25582188" target="_blank"> <img src="./assets/img/product-2.jpg" class="card-img-top" alt="..."> <div class="card-footer"> <div class="row"> <div class="col-6"> <b>Avocado</b> </div> <div class="col-6 text-end"> <p class="text-success mb-0">$100.00</p> </div> </div> </div> </a>
Card 16
<a class="card" href="https://themeforest.net/item/cork-responsive-admin-dashboard-template/25582188" target="_blank"> <img src="./assets/img/product-3.jpg" class="card-img-top" alt="..."> <div class="card-footer"> <div class="row"> <div class="col-6"> <p class="text-success mb-0">$623.00</p> </div> <div class="col-6 text-end"> <b>Shoes</b> </div> </div> </div> </a>
Card 17
Kelly Young
Project Manager
Powerful CRM admin dashboard template based on Bootstrap and Sass for all kind of back-end projects.
<div class="card style-4"> <div class="card-body pt-3"> <div class="media mt-0 mb-3"> <div class=""> <div class="avatar avatar-md avatar-indicators avatar-online me-3"> <img alt="avatar" src="assets/img/profile-2.jpeg" class="rounded-circle"> </div> </div> <div class="media-body"> <h4 class="media-heading mb-0">Kelly Young</h4> <p class="media-text">Project Manager</p> </div> </div> <p class="card-text mt-4 mb-0">Powerful CRM admin dashboard template based on Bootstrap and Sass for all kind of back-end projects.</p> </div> <div class="card-footer pt-0 border-0 text-center"> <a href="javascript:void(0);" class="btn btn-secondary w-100"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-slack"><path d="M14.5 10c-.83 0-1.5-.67-1.5-1.5v-5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5v5c0 .83-.67 1.5-1.5 1.5z"></path><path d="M20.5 10H19V8.5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5-.67 1.5-1.5 1.5z"></path><path d="M9.5 14c.83 0 1.5.67 1.5 1.5v5c0 .83-.67 1.5-1.5 1.5S8 21.33 8 20.5v-5c0-.83.67-1.5 1.5-1.5z"></path><path d="M3.5 14H5v1.5c0 .83-.67 1.5-1.5 1.5S2 16.33 2 15.5 2.67 14 3.5 14z"></path><path d="M14 14.5c0-.83.67-1.5 1.5-1.5h5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5h-5c-.83 0-1.5-.67-1.5-1.5z"></path><path d="M15.5 19H14v1.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5-.67-1.5-1.5-1.5z"></path><path d="M10 9.5C10 8.67 9.33 8 8.5 8h-5C2.67 8 2 8.67 2 9.5S2.67 11 3.5 11h5c.83 0 1.5-.67 1.5-1.5z"></path><path d="M8.5 5H10V3.5C10 2.67 9.33 2 8.5 2S7 2.67 7 3.5 7.67 5 8.5 5z"></path></svg> <span class="btn-text-inner ms-3">Join her on Slack</span></a> </div> </div>
Card 18
Web Design
Powerful CRM admin dashboard template based on Bootstrap and Sass for all kind of back-end projects.
4
<div class="card style-4"> <div class="card-body pt-3"> <div class="media mt-0 mb-3"> <div class=""> <div class="avatar avatar-md avatar-indicators avatar-online me-3"> <img alt="avatar" src="assets/img/profile-2.jpeg" class="rounded-circle"> </div> </div> <div class="media-body"> <h4 class="media-heading mb-0">Kelly Young</h4> <p class="media-text">Project Manager</p> </div> </div> <p class="card-text mt-4 mb-0">Powerful CRM admin dashboard template based on Bootstrap and Sass for all kind of back-end projects.</p> </div> <div class="card-footer pt-0 border-0 text-center"> <a href="javascript:void(0);" class="btn btn-secondary w-100"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-slack"><path d="M14.5 10c-.83 0-1.5-.67-1.5-1.5v-5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5v5c0 .83-.67 1.5-1.5 1.5z"></path><path d="M20.5 10H19V8.5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5-.67 1.5-1.5 1.5z"></path><path d="M9.5 14c.83 0 1.5.67 1.5 1.5v5c0 .83-.67 1.5-1.5 1.5S8 21.33 8 20.5v-5c0-.83.67-1.5 1.5-1.5z"></path><path d="M3.5 14H5v1.5c0 .83-.67 1.5-1.5 1.5S2 16.33 2 15.5 2.67 14 3.5 14z"></path><path d="M14 14.5c0-.83.67-1.5 1.5-1.5h5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5h-5c-.83 0-1.5-.67-1.5-1.5z"></path><path d="M15.5 19H14v1.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5-.67-1.5-1.5-1.5z"></path><path d="M10 9.5C10 8.67 9.33 8 8.5 8h-5C2.67 8 2 8.67 2 9.5S2.67 11 3.5 11h5c.83 0 1.5-.67 1.5-1.5z"></path><path d="M8.5 5H10V3.5C10 2.67 9.33 2 8.5 2S7 2.67 7 3.5 7.67 5 8.5 5z"></path></svg> <span class="btn-text-inner ms-3">Join her on Slack</span></a> </div> </div>
Copyright © 2022 DesignReset, All rights reserved.
Coded with