2.0.9 • Public • Published

Foundation Design System

Foundation Design System is a collection of design tokens, components and guidelines for building cohesive UI systems within parts of Envato.

Status: Work in Progress.

Table of Contents

Developer Setup

In order to set up the project locally follow these steps:

  1. Clone the repository: git clone git@github.com:envato/foundation-design-system.git
  2. Install dependencies: npm i
  3. Watch (and automatically build): npm start
  4. Preview the site at localhost:3000.

The project has been bootstrapped with Create React App and the following files must exist in order to build the sites correctly:

  • index.html: the page template
  • src/favicon.ico: the icon representing the site in the browser tab
  • src/index.js: the JavaScript entry point.

Remember to always base your feature branch off of master.

Publishing to NPM

Read the Publishing guide on how to version and publish modules to NPM.

Using the Design System

Read the How to Use Guide for possible installation options for the Foundation Design System within your project.

Creating Design Tokens

Read our Creating Design Tokens Guide.


Please familiarise yourself with our Contributing Guidelines to make the contribution process easy and effective for everyone involved.


Code of Conduct

This project adheres to the Contributor Covenant Code Of Conduct. By participating, you are expected to uphold this code. Please report unacceptable behavior to market-foundation-dev@envato.com.




npm i @envato-foundation/foundation-design-system

DownloadsWeekly Downloads






Last publish


  • fraserxu
  • envato-foundation