A Modern Docs Theme for Gatsby

The Chicago Docs theme for Gatsby is a modern and professional docs site for small open source projects. It was designed to be readable, easy to navigate, and accessible.

gatsby new your-site-name https://github.com/kabartolo/gatsby-starter-chicago-docs

Features

The Chicago Docs theme includes

• MDX
• Theme-UI
• SASS and CSS modules
• Typography.js
• Code highlighting with prism-react-renderer
• Dark and light modes
• Code blocks with live preview, line numbers, and line highlighting, as well as a title, copy button, and language selection
• Documentation search
• Several components for displaying your docs, such as a property table

Features currently in development:

• Support for Algolia DocSearch
• Support for OpenAPI definitions and code generation

Styling

Many reusable styles are defined using Theme-UI. The site layout is styled mainly using CSS modules and SASS. All styles can be customized through shadowing.

All components include regular class names, so you can customize the site using plain CSS if you prefer.

Components

A mark of good reference documentation is how easy it is to skim for the information a user needs. Docs in this theme are written in MDX, and the theme comes with several components that help present your docs in a way that makes them easy to scan. These are used throughout this demo, and the Example API Doc offers a complete demonstration.