{"id":13804940,"url":"https://github.com/phase2/outline","last_synced_at":"2025-04-05T11:07:53.370Z","repository":{"id":37543495,"uuid":"379637295","full_name":"phase2/outline","owner":"phase2","description":"Tooling infrastructure for modern web component development.","archived":false,"fork":false,"pushed_at":"2024-03-12T14:11:05.000Z","size":74180,"stargazers_count":131,"open_issues_count":21,"forks_count":27,"subscribers_count":33,"default_branch":"next","last_synced_at":"2025-03-29T10:05:45.767Z","etag":null,"topics":["components","components-library","design-system","hacktoberfest","javascript","lit","lit2","outline","storybook","tailwindcss","typescript","web-components"],"latest_commit_sha":null,"homepage":"https://outline.phase2tech.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/phase2.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-06-23T14:49:29.000Z","updated_at":"2025-03-17T06:10:09.000Z","dependencies_parsed_at":"2023-10-03T19:28:03.461Z","dependency_job_id":"788b1276-7f8e-4da9-97ad-9a61668dc978","html_url":"https://github.com/phase2/outline","commit_stats":{"total_commits":896,"total_committers":25,"mean_commits":35.84,"dds":0.3861607142857143,"last_synced_commit":"9d4be5c67622d88114bd773acdfc305820a27f1d"},"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/phase2%2Foutline","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/phase2%2Foutline/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/phase2%2Foutline/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/phase2%2Foutline/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/phase2","download_url":"https://codeload.github.com/phase2/outline/tar.gz/refs/heads/next","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247325693,"owners_count":20920714,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["components","components-library","design-system","hacktoberfest","javascript","lit","lit2","outline","storybook","tailwindcss","typescript","web-components"],"created_at":"2024-08-04T01:00:55.528Z","updated_at":"2025-04-05T11:07:53.354Z","avatar_url":"https://github.com/phase2.png","language":"TypeScript","funding_links":[],"categories":["Real World","Design Systems"],"sub_categories":["Design Systems"],"readme":"\n# OutlineJS\n\n[![Version](https://img.shields.io/npm/v/@phase2/outline-core.svg)](https://npmjs.org/package/@phase2/outline-core)\n[![GitPod](https://img.shields.io/badge/gitpod-development-lightgray?logo=gitpod\u0026logoColor=ffffff\u0026style=flat)](https://gitpod.io/#https://github.com/phase2/outline)\n[![License](https://img.shields.io/npm/l/@phase2/outline-cli.svg)](https://github.com/phase2/outline/blob/next/package.json)\n\n## Storybook Hosting\n\n[![Netlify](https://img.shields.io/badge/netlify-outlinejs.style-success?logo=netlify\u0026logoColor=ffffff\u0026style=flat)](https://outlinejs.style/)\n[![GitHub Pages](https://img.shields.io/badge/pages-outline.phase2tech.com-success?logo=github\u0026logoColor=ffffff\u0026style=flat)](https://outline.phase2tech.com/)\n[![Chromatic](https://img.shields.io/badge/chromatic-next-success?logo=storybook\u0026logoColor=ffffff\u0026style=flat)](https://next--636082675ab89919e6bcfd40.chromatic.com/)\n\nOutline is a both a growing [Web Component](https://developer.mozilla.org/en-US/docs/Web/Web_Components) 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.\n\n## More than a Design System\n\nOutline is much more than just you run of the mill design system. Outline provides an added benefit on top of multiple similar libraries available.\n\n* Outline is a set of components\n* Outline is a set of tooling and technology to scaffold design systems for a multitude of projects\n* Outline is a set of rules for defining components\n* Outline is a set of rules for integrating components\n* Outline provides well curated documentation on many complex topics\n* Outline grows with internal lessons learned project after project here [@phase2](https://github.com/phase2).\n\nOutline and Outline design systems are built with many of the following notable tools:\n\n* [![Turborepo](https://img.shields.io/badge/turborepo-v1.6.0-blue?logo=turborepo\u0026logoColor=ffffff\u0026style=flat)](https://lit.dev/)\n* [![Lit](https://img.shields.io/badge/lit-v2-blue?logo=lit\u0026logoColor=ffffff\u0026style=flat)](https://lit.dev/)\n* [![TypeScript](https://img.shields.io/badge/typescript-v4.8.4-blue?logo=typescript\u0026logoColor=ffffff\u0026style=flat)](https://www.typescriptlang.org/)\n* [![CSS Custom Properties](https://img.shields.io/badge/CSS_Custom_Properties-Level_1-blue?logo=css3\u0026logoColor=ffffff\u0026style=flat)](https://www.w3.org/TR/css-variables-1/)\n* [![Storybook](https://img.shields.io/badge/Storybook-v7-blue?logo=storybook\u0026logoColor=ffffff\u0026style=flat)](https://www.w3.org/TR/css-variables-1/)\n* [![Postcss](https://img.shields.io/badge/PostCSS-v8-blue?logo=postcss\u0026logoColor=ffffff\u0026style=flat)](https://postcss.org/)\n* [![TailwindCSS](https://img.shields.io/badge/TailwindCSS-v3-blue?logo=tailwindcss\u0026logoColor=ffffff\u0026style=flat)](https://postcss.org/)\n\n## Scaffolding a new Outline project\n\nOutline 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.\n\n### Using NPX (recommended)\n\n\u003e 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.\n\n```bash\nnpx @phase2/outline-cli init\n```\n\n\n### Global Installation\n\nThis method will require manually updating from time to time for the latest updates on your system. If you are using [NVM](https://github.com/nvm-sh/nvm) appropriately, any version of node would need this installed. If you are using yarn, you can just install it once globally.\n\n#### With NPM\n\n```bash\nnpm install -g @phase2/outline-cli\noutline init\n```\n\n#### With Yarn\n\n```bash\nyarn global add @phase2/outline-cli\noutline init\n```\n\n## Contributing to Outline\n\nDetailed information regarding how to contribute to Outline development, can be found in [CONTRIBUTING.md](./CONTRIBUTING.md). **Expect this information to be refined soon.**\n\nPlease see [Component Development Guide](https://github.com/phase2/outline/tree/affc18d1a7ca6a304813f97f0563afcb6967a6ef/packages/documentation/outline-docs/src/guides/development/component-development) for information about developing for Outline.\n\n[![Deploys by Netlify](https://www.netlify.com/v3/img/components/netlify-color-accent.svg 'Deploys by Netlify')](https://www.netlify.com)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fphase2%2Foutline","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fphase2%2Foutline","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fphase2%2Foutline/lists"}