scherler/outline

Outline is a web component based design system starter kit. Outline is based on the latest technologies and tools to help your component authoring experience and facilitate adoption in your organization.

OutlineJS

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.