前端 框架
一组支持 Pinterest 设计语言的 React UI 组件库


Build status NPM Version

Gestalt is a set of React UI components that enforces Pinterest’s design language. We use it to streamline communication between designers and developers by enforcing a bunch of fundamental UI components. This common set of components helps raise the bar for UX & accessibility across Pinterest.

View the full docs or Check out the Gestalt playground


Gestalt exports each component as ES6 modules and a single, precompiled CSS file:

import { Text } from 'gestalt';
import 'gestalt/dist/gestalt.css';

That syntax is Webpack specific (and will work with Create React App), but you can use Gestalt anywhere that supports ES6 module bundling and global CSS.


Gestalt is a multi-project monorepo. The docs, components and integration tests are all organized as separate packages that share similar tooling.

Install project dependencies and run tests:

yarn test

Build and watch Gestalt & run the docs server:

yarn start

Visit http://localhost:3000/ and click on a component to view the docs.

Using the Masonry playground:

cd test && yarn start
open "http://localhost:3001/Masonry"

Running Masonry's integration tests. This will leave lots of Firefox processes hanging around, so please be warned.



If you haven’t already, you’ll first need to create an npm account. Once you've done that you can setup your username and email in Yarn using yarn login.

The following outlines our release process:

  1. Checkout a new branch.
  2. Bump package version in packages/gestalt/package.json & update
  3. Open a pull request with the new version and land that in master.
  4. Once the version is bumped in master, checkout that commit locally.
  5. Run the release script from the root directory of the project ./scripts/publish.js to publish the tag, npm package, and docs.
  6. Draft a new release from the tag at
gestalt 相关推荐