Skip to content

Introduction

Adopt the components you need, then extend them in your own product.

Ghost UI is a React component library built around focused owners, shared theme tokens and explicit application state. Install individual components as source, compose them into your product, and keep control of your data and behavior.

Start with a working component

Follow Installation to add Button to an existing React project. Component pages provide a working preview, copyable source, supported compositions and API reference. The registry brings the local dependencies and styles an item needs.

For a larger task, choose a library: forms, tables, charts, scheduling, emoji/icons or AI interfaces. Those guides explain data, state and integration. Your application still owns persistence, transport and business policy.

Adapt the system

Styling explains where overrides belong. Theme tokens change shared visual meaning; Typeset controls reading rhythm. Component hierarchy helps you decide whether a new need is a part, a component or a product composition.

Build your own component set

Use Extend the library to create components with compatible APIs, styling and documentation. Install the Ghost craft and technical writing skills to give your coding agent those conventions. The skills teach a method you can apply in your own repository; they do not install React components.

  • Getting started: initial setup and a first usable component.
  • Guides: customization, architecture, extension and distribution details.
  • Skills: installable agent instructions for component craft and technical writing.
  • Components: visual examples and the contract of one UI owner.
  • Libraries: domain data, state and integration across related components.

Start with the task and the actual API. Use a visual example when it helps explain appearance or interaction; setup and reference pages should remain useful as text and code.