Skip to content
Customization-first Vue.js UI framework for eCommerce.
JavaScript CSS HTML Vue TypeScript
Branch: master
Clone or download
Pull request Compare This branch is 2174 commits behind DivanteLtd:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Storefront UI

Netlify Status

This project is on the early stages of development. Not ready for production use. Expect some things to be broken and api to change

We are looking for contributors and agencies willing to join us and build best UI library for Vue together!

Customization-first and elegant UI framework for eCommerce (and not only) based on Vue.js and Google Retail UX Playbook. Made with ❤️ by Vue Storefront team.

What makes it unique?

Some libraries aim to give as much as they can out of the box but they faill when it comes to customization. Our goal was to enable as much as possible out of the box but with primar focus on ability to customize any aspect of the components.

With sfui you need to do a little bit more than with other libs for basic tasks but you get 100% customizable components in return!

You can easly change almost every aspect of provided components and use them to make stunning eCommerce shops (and not only)!

Here are the key characteristics of Storefront UI:

  • Ability to customize any aspect of the library.
  • Seamless upgrades
  • High-level global customization can be done through SCSS variables
  • Component content customization with slots.
  • Component design customization with pure css BEM classes instead of countless props.
  • Possibility to compose your own components from partials (markup/Vue instance/SCSS)
  • Implementation of Atomic Design (with limit to atoms, molecules and organisms)

Read about code design concepts behind Storefront UI and how it can be customized.


You can find the stunning designs we are using for Storefront UI components here

How to try it?

Storefront UI is not ready to use in projects yet. We plan to release working alpha before the end of April 2019. If you want to check current state of components just check storybook If you really want to play with components: npm install --save @storefrontui/vue

Then check if sfui.scss file was created in a root of your app. If not - create it.


The documentation is always THE HARDEST PART of each open source project! But we're trying hard. Feel free to contribute to the documentation if you like.

Please find out what we've already managed to prepare: available here. Please note that the documentation is not yet finished as this project is still in the early stages of development and will be continuously updated. You can find them also under the docs/ folder.


We are currently in a process of building the library. If you want to help shaping future of vue and eCommerce UI's we'd be more than happy if you want to contribute! Here you can find all the required information.

Cooperation with Alpacas

Ideas behind Storefront UI and Alpaca are common efforts. We joined forces in figuring out how to make things right to deliver best possible experience to the users.


e-com club


  • Category page components (April) - Done
  • Product Page components (May) (alpha release)
  • Homepage, form elements and a11y (June)
  • Last polishments and focus on documentation (June/July) (beta release)

Want to help and make it even faster? Grab an issue and become part of our amazing community ;)

You can’t perform that action at this time.