Awesome
OutlineJS
Storybook Hosting
Outline is a both a growing Web Component library as well as a toolkit for building out bespoke design systems for a wide variety of client and personal usages. Outline is based on the latest technologies and tools to help your component authoring experience and facilitate adoption in your organization.
More than a Design System
Outline is much more than just you run of the mill design system. Outline provides an added benefit on top of multiple similar libraries available.
- Outline is a set of components
- Outline is a set of tooling and technology to scaffold design systems for a multitude of projects
- Outline is a set of rules for defining components
- Outline is a set of rules for integrating components
- Outline provides well curated documentation on many complex topics
- Outline grows with internal lessons learned project after project here @phase2.
Outline and Outline design systems are built with many of the following notable tools:
Scaffolding a new Outline project
Outline is organized as a mono-repo and is available to use via NPM Packages and our CLI. The outline-cli
simplifies the setup process using pre-defined templates available in the outline-templates
package as guides on basic scaffolding of new Outline based projects.
Using NPX (recommended)
This method will load the latest version of the Outline CLI to cache, and prompt you when an update is available. This makes it easier than managing a local version to simply run
outline init
instead.
npx @phase2/outline-cli init
Global Installation
This method will require manually updating from time to time for the latest updates on your system. If you are using NVM appropriately, any version of node would need this installed. If you are using yarn, you can just install it once globally.
With NPM
npm install -g @phase2/outline-cli
outline init
With Yarn
yarn global add @phase2/outline-cli
outline init
Contributing to Outline
Detailed information regarding how to contribute to Outline development, can be found in CONTRIBUTING.md. Expect this information to be refined soon.
Please see Component Development Guide for information about developing for Outline.