1. Getting started
2. Element catalog
3. Creating components
4. Theming components

PatternFly Elements is a collection of flexible and lightweight Web Components, and the tools to build them. PatternFly Elements are:

• Lightweight: small file size, minimal boilerplate, no "framework-like" features.
• Universal: write once, use everywhere. PatternFly Elements work in React, Vue, Angular, vanilla JS, anywhere HTML elements are used.
• Themable: Make overrides as needed via attributes or CSS variables

The result of these principles is that you can plug one set of components into a wide variety of applications; bringing UX consistency and developer familiarity to any web project.

A Yeoman generator is included for creating Web Components that meets these goals.

git clone git@github.com:patternfly/patternfly-elements.git
cd patternfly-elements
npm install # this will take a while due to lerna bootstrap
npm run storybook

The storybook script will launch the interactive demo pages.

Note: You will need to use Node v.7 or higher.

home | start | develop | theming | storybook | web components