Interactive API docs, rendered from your spec.

apiuikit is a React component library for AsyncAPI and OpenAPI documents. Drop in the whole documentation page, one section on its own, or compose exactly the pieces your layout needs. No manual mapping, no renderer to maintain.

Why apiuikit

Modular pieces, not a monolith.

Rendering servers, operations, schemas, and auth for two spec formats is weeks of undifferentiated work. Take the pieces you need and skip building a renderer of your own.

2
Spec formats
AsyncAPI 3.x and OpenAPI 3.0 and 3.1, both fully supported.
3
Payload formats
JSON Schema, Avro, and Protobuf, with nothing extra to install.
5
Frameworks
React natively, plus Vue, Angular, Svelte, and plain HTML via web components.

Every operation, rendered straight from the spec.

Payloads, examples, and reply pairs land in place, with nothing to wire up and nothing to keep in sync by hand.

AsyncAPI Operations

Every path and method, given the same treatment.

Parameters, responses, and generated cURL, JavaScript, and Python samples for each endpoint you publish.

OpenAPI Endpoints

Auth that matches what the API actually enforces.

Servers, protocols, and API key, HTTP, OAuth2, and OpenID Connect security, read out of the document rather than mapped by hand.

Auth

Payloads matched to the operations that carry them.

Examples render with the message they belong to, and Avro and Protobuf work out of the box with nothing extra to install.

Messages

Deep schemas you can actually follow.

Nested objects, oneOf branches, and resolved $refs in an expandable tree, colour-coded by nesting depth.

Schemas

The info block, laid out without you touching it.

Title, version, description, and license, parsed from the document and re-rendered whenever it changes.

Info

See it running

One document in, a whole documentation site out.

The same Petstore file on both tabs: an interactive page for people to read, and Markdown for agents to consume.

One OpenAPI file, rendered as a page you can browse: every endpoint grouped under its path, with parameters, responses, and ready-made request samples. Click an endpoint to open its details.

  • Composable sections

    Render one section standalone, or compose several under a shared provider.

  • Multi-format schemas

    Avro and Protobuf payloads supported out of the box, no extra install.

  • AI-readable by default

    Every document ships a Copy-as-Markdown button and llms.txt helpers.

  • Any framework

    The web-component package wraps React internally for Vue, Angular, Svelte, or plain HTML.

  • Full auth coverage

    API key, HTTP, OAuth2, and OpenID Connect security, rendered automatically.

  • OpenAPI webhooks

    OpenAPI 3.1 webhooks render alongside regular endpoints.

  • Built-in search

    Every section is searchable from the sidebar, no setup required.

  • Themeable

    Light and dark themes out of the box, and a config object to override every color.

How you use it

Three ways to use it.

Start with the whole widget, drop down to a single section, or compose several. Same API, whatever granularity your layout needs.

widget.tsx
import { AsyncAPI } from "apiuikit";
import "apiuikit/style.css";
import doc from "./asyncapi.json";

export default function App() {
  return <AsyncAPI asyncapi={doc} />;
}

No build step

apiuikit from your terminal.

Generate or serve API documentation directly from an AsyncAPI or OpenAPI document, without wiring up a React app.

One command turns a spec file into a static site you can open from disk or publish anywhere — built for Spring, Go, and Python services, docs-only repos, and CI pipelines.

Explore the CLI
$ npx @apiuikit/cli generate ./openapi.yaml
Generated API documentation site
Spec type
OpenAPI
Title
Swagger Petstore - OpenAPI 3.0
Output
apiuikit-docs
$ npx @apiuikit/cli serve
Serving on http://127.0.0.1:4300

Getting it in

Incremental, not all-or-nothing.

Render one section inside a page you already have and ship it. Add the rest whenever you want them, or never.

Drop into an existing page

No rewrite required: render one section standalone inside a page you already have, then add more as you need them.

Not just React

@apiuikit/web-component bundles React internally and exposes plain custom elements for Vue, Angular, Svelte, or vanilla HTML.

Full TypeScript support

Every component, config option, and helper is fully typed, including the AsyncAPI and OpenAPI document shapes themselves.

Go to the repo

Get help from the maintainers.

apiuikit is free and open source. We can help you integrate it, adopt AsyncAPI or OpenAPI across your team, and work through theming or migration questions.

Talk to the maintainers