# How to document a design system
## 👋 Introduction
One thing that differentiates a design system from just a component library is its documentation. A design remains incomplete without guidelines and a centralised place from which it can be understood and consumed.
***
## 1️⃣ Create a reference website
Product teams will only be able to use the system properly if it’s well-understood and easily accessible. This can be **accomplished by creating a reference website**. A reference site primarily helps:
* Showcasing design system components and guidelines
* Making documentation easy to access and understand
> Here’s an [example](https://zeroheight.com/1d8569481/p/04e4c3-button) of a component page on a reference website. Resist the urge to build a custom site for v1, and instead, use a non-code tool like Zeroheight so teams can contribute without writing code.
It’s important that your reference be unique to the specific needs of your organization, but here’s set of content that any design system user will probably be looking for. Use the structure below as a starting point for the sections your design system users may expect:
* Home
* Get started
* Guidelines / Patterns
* Accessibility
* Brand
* Color
* Error handling
* Icons
* Illustrations
* Typography
* Voice and tone
* Etc..
* Components
* Overview (containing component status page)
* Accordion
* Button
* Breadcrumb
* Card
* Etc.
* Case studies
* Support
* Blog/News
* About
* Changelog
* Search
***
## 2️⃣ Further reading
[Design System documentation best practices](https://backlight.dev/blog/design-system-documentation-best-practices/)
["Making Design Systems Public," an article by Dan Mall](https://danmall.com/posts/making-design-systems-public/)
[Structuring documentation in multi-brand design systems by Amy Hupe, content designer](https://amyhupe.co.uk/articles/structuring-documentation-multi-brand-design-systems/)
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://university.obvious.in/product-design/design-system/how-to-document-a-design-system.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.