Get 50% off on all templates until Dec 3, 11:59pm PT! Code: 1128CWWFTS123

Cafe and roastery ecommerce Ui Kit. With over 30 custom pages and various bespoke components, this template features everything you need to start your coffee shop or coffee supply business it even has barista training and coffee shop courses.

No items found.

Customize this template

Schedule a time with a Webflow expert to customize this template. Learn more

Get started

Cafe, Coffee Roastery Ecommerce Ui Kit Website Template

Barebeans is a fully fledged cafe and coffee roastery ecommerce Ui Kit. With over 30 custom pages and various bespoke components, this template features everything you need to start your coffee shop or coffee supply business it even has barista training and coffee shop courses.

Coffee Shop Ecommerce Website Template

The focus for this template Ui Kit was catering for the wider coffee trade not just cafe's, that's why the template features pages and CMS collections for training and courses, wholesale supplier and ecommerce pages with a custom checkout experience.

Accessibility Checked Headline

Every page on this template has been accessibility checked using Webflow's in built Audit panel, all images have ALT text set or they are set to Decorative for images that offer little to no context. The take away point, this template is ready for real world use, leaving no potential viewers and visitors behind.

Learn more about Webflow's accessibility audit panel.

Templates Features

  • Fully Responsive – A fully responsive template and displays perfectly on all screen sizes and mobile devices, expertly crafted.
  • Interactions – Comes loaded with interactions and button animations to take the user experience to the next level.
  • Browser Compatibility – This template supports all the major browsers including IE11+, Chrome, Safari, Firefox, Edge.
  • Web Fonts – It uses fonts from Google's Web Font collection.
  • Lottie Animations – Lottie is a JSON-based animation file format. They are small files that work on any device and can scale up or down without pixelation. Check out Lottie Files
  • Ecommerce – Completely custom ecommerce experience from product view to checkout.

Usage Rights

All the images in this template can be used for personal or commercial use. Details for the licencing can be found on the Licence page in the template.

Support

Here are some handy links for learning how to edit and use Webflow.

Or you can contact me directly by email or send me a message in the Support Tab.

Share
Features
EcommerceCMS
Content management system

Customize the built-in database for your project or just add new content.

EcommerceCMS
Responsive design

Displays perfectly on desktops, tablets, and phones.

EcommerceCMS
Forms

Build your lead lists and subscriber base with beautiful forms.

EcommerceCMS
Responsive navigation

Site navigation automatically collapses into a mobile-friendly menu on smaller devices.

EcommerceCMS
Web fonts

Uses fonts from Google's Web Font collection.

EcommerceCMS
Retina ready

All graphics are optimized for devices with high DPI screens.

EcommerceCMS
Symbols

Reusable elements you can use across your site. Edit a symbol and all copies update instantly.

EcommerceCMS
Interactions

Comes with animations and interactions for additional polish and usability.

EcommerceCMS
Responsive slider

Display images and text elegantly on every device with our touch-friendly slider.

EcommerceCMS
Background video

Bring life and motion to your design with background videos

EcommerceCMS
Custom 404 page

Custom design for the 404 page of your website

EcommerceCMS
CSS Grid

Reposition and resize items anywhere within the grid to produce powerful, responsive layouts — faster and without code.

EcommerceCMS
Ecommerce

Shape your customer's experience and customize everything, from the home page to product page, cart to checkout.

Single Use License

Can only be used by you or one client for one end product. You cannot resell or redistribute this template in its original or modified state.

Free License

This template is free to use in both person and commercial projects. You cannot resell, redistribute, or license this template in its original or modified state.

License information
Aaron Grieve supports this template
Designed by Aaron Grieve

Questions about this template? Just reach out to the template designer and they will get back to you within 2 business days.

For advanced design guidance, please share your questions in the Webflow Forum or reach out to a Webflow Expert.

Loving this template?

Share your feedback by leaving a comment below.

For template support, please check the Support tab.

Is there a template demo available?

Use the Preview in Designer option to make any edits to the template pages and preview how the layout would fit your content. Changes in preview mode won't be saved.

Can templates be used in existing projects?

It isn't possible to apply a template to an already existing project. Instead, you'll need to create a new project based on the Template.

How many template pages can be edited with a Free Account Plan?

With a Free account plan, it is possible to edit two pages of the template-based project. To unlock more pages and features a premium plan is required.

Can templates be exported?

With a Core plan (or higher), you can export sites you build in Webflow, including templates, to host them anywhere you'd like.

How to purchase a template from a legacy team account?

Webflow templates are only available for purchase through Workspaces and legacy individual accounts.

How to remove the CMS functionality from a template?

CMS templates are designed to use the power of the Webflow CMS. It is possible to downgrade to a Basic Site Plan as long as all CMS content is deleted from the project.

Use the View Connections tool to understand where the CMS content is on the site and delete any dynamic listings and CMS content. We also recommend you to check Components and the Collection page Templates.

How to remove the Ecommerce functionality from a template?

Ecommerce templates are designed to use the power of Webflow Ecommerce. It is not possible to remove Ecommerce from a template, however, deleting all Ecommerce Products and Categories from the project, will allow to select a lower Site Plan.

How to remove the Memberships functionality from a template?

Membership templates are designed to use the power of Webflow Membership. It is not possible to remove Memberships from a template.

Fully customizable in Webflow

All templates were built by designers using Webflow without writing code. That means you can customize them using our visual interface too.

Find out how

Recent Coffee Shop templates

All Coffee Shop templates
Roasters
Ecommerce
Ecommerce functionality built in. Just add products.
CMS
Dynamic content and a Visual CMS built in.
UI Kit
Multiple layout variations built in.
Java
Ecommerce
Ecommerce functionality built in. Just add products.
CMS
Dynamic content and a Visual CMS built in.
UI Kit
Multiple layout variations built in.
Joy
Ecommerce
Ecommerce functionality built in. Just add products.
CMS
Dynamic content and a Visual CMS built in.
UI Kit
Multiple layout variations built in.
Grindo 128
Ecommerce
Ecommerce functionality built in. Just add products.
CMS
Dynamic content and a Visual CMS built in.
UI Kit
Multiple layout variations built in.

More by Aaron Grieve

All templates by Aaron Grieve
Outventurist
Ecommerce
Ecommerce functionality built in.
CMS
CMS functionality functionality built in.
UI Kit
Multiple layout variations built in.
Ashfall
Ecommerce
Ecommerce functionality built in.
CMS
CMS functionality functionality built in.
UI Kit
Multiple layout variations built in.
Glamping
Ecommerce
Ecommerce functionality built in.
CMS
CMS functionality functionality built in.
UI Kit
Multiple layout variations built in.
Pet Vets
Ecommerce
Ecommerce functionality built in.
CMS
CMS functionality functionality built in.
UI Kit
Multiple layout variations built in.

Want to sell your own website templates?

Check out the review process and guidelines to get started selling your own website templates.

See how
Webflow Responsive Templates