A prototype for a foundational design system at Shopify
About this repo | Projects | How to use this repo | Technical details | Contribute to our explorations | Resources
The experience platform for Shopify. This repository is focused on centralizing foundational design system resources.
Current status | Owner | Help |
---|---|---|
paused | @polaris-team | #polaris |
A public version of our Github Project will be coming soon!
Make sure Git and Node.js are installed on your computer, then run the following commands in your terminal to get started:
$ git clone https://github.com/Shopify/foundational-design-system-proto.git # git clone repository
$ cd foundational-design-system-proto # access the files
$ npm install # install dependencies
$ npm run dev # run locally
As we continue to iterate and evolve, these technologies are subject to change. Currently, the foundations are built using the following technologies as part of our React TypeScript stack:
For questions about our tech stack, go to #polaris
We'd love to hear what you think. Start a conversation in Github Discussions!
An NPM package of experimental React components for layout, including abstractions for flexbox and grid, built with Vanilla Extract and Sprinkles.
NPM
npm install @shopify/layout-experimental
Yarn
yarn add @shopify/layout-experimental
import '@shopify/layout-experimental/dist/style.css';
We have created a sandbox utilizing the experimental release of our foundational layout components: Box, Grid, Flex, and more. Check it out to see examples of how the components can be used and try them out yourself!