hero

Storefront UI

Customizable and performant Vue.js UI library for eCommerce

Get Started →

Customization

Along with standard prop-based customization, every component has a set of slots that let you replace any part of it with your own images, icons or even custom HTML markup. In addition, every component is divided into separate HTML, CSS and JS files so you can compose your own components from Storefront UI partials or override certain components.

Best practices

Storefront UI components follow best practices in terms of design and code. Every component is based on the Google Retail UX Playbook and is accessibility-friendly. You’re importing ONLY what you need, and in a raw format which means you can benefit from all build-time optimizations like tree shaking or grouping common chunks.

Mobile-first

Every Storefront UI component is highly optimized for mobile user experience and in many cases behaves completely different on desktop and mobile. Select list becomes full-screen drop-down, tabs are becoming accordion etc.

# Installation

Install NPM package:

npm install --save @storefront-ui/vue

Import styles (optional)

import "@storefront-ui/vue/styles.scss"

Import and register components that you need

import { SfButton } from '@storefront-ui/vue'

export default {
  components: {
    SfButton
  }
}

voila!

# Supporters

divantee-com club