Offcanvas V02
Template Details
Author: Colorlib
Released: September 2026
License: CC BY 3.0
Description
A cart drawer that slides in from the right on a coffee roaster's product page. Each line item has a photo, a quantity stepper and a remove link, and the subtotal, shipping, total and free-shipping progress bar update as quantities change. Add to cart on the page increases the matching line and opens the drawer.
It is plain HTML and CSS plus a few lines of vanilla JavaScript: no jQuery, no Bootstrap files, no plugins, and the download is 331 KB. Use it on its own, or drop it into a Bootstrap 4, 5 or 6 project and it looks the same.
- Quantity steppers with min and max limits and a typed-in fallback
- Subtotal, shipping, total and cart badge recalculated on every change
- Free-shipping progress bar with aria-valuetext
- Remove with focus moved to the next item, plus an empty state
- Native dialog modal with Esc, backdrop click, focus return and scroll lock
Similar Templates
