Scalar API Reference

Scalar API Reference turns an OpenAPI or Swagger document into a beautiful, interactive API reference that you can embed in any web page. It renders operations, schemas, and authentication details from your spec, generates ready-to-copy code samples across many languages and frameworks, and ships with a built-in request tester so consumers can try endpoints without leaving the docs.

Built as a Vue component with a framework-agnostic standalone bundle and a React wrapper, it drops in via a single CDN script tag or as an imported component. It is fully themeable, works offline-first, and is trusted at scale with more than 20 million monthly npm installs.

What You Get

• A drop-in interactive API reference rendered directly from an OpenAPI or Swagger document
• A built-in API request tester so readers can call endpoints from within the docs
• Automatic code-sample generation across many languages and HTTP client libraries
• Full theming and customization plus first-class integrations for popular frameworks
• Multiple delivery formats: a CDN standalone script, a Vue component, and a React wrapper

Common Use Cases

• Publishing public-facing API documentation for a REST service
• Embedding live, testable API references inside an existing docs site or dashboard
• Replacing an aging Swagger UI setup with a modern, themeable reference
• Giving internal teams an interactive way to explore and try microservice endpoints

Under The Hood

Architecture - The package (packages/api-reference) is a Vue 3 application layered from a public entry (src/index.ts, src/standalone.ts, src/esm.ts) down through feature modules, components, hooks, and plugins. The standalone build exposes a global Scalar.createApiReference(‘#app’, options) API that mounts the reference into a target element, while the ESM/component builds let you import it directly; a workspace store synchronizes the parsed OpenAPI document into the reactive UI, sidebar navigation, and search.

Tech Stack - Written in TypeScript on Vue 3, it composes a large set of internal workspace packages (@scalar/api-client, @scalar/components, @scalar/oas-utils, @scalar/themes, @scalar/snippetz for code generation, @scalar/workspace-store) plus third-party libraries such as @vueuse/core, fuse.js for fuzzy search, yaml, nanoid, and microdiff. Builds are produced with Vite across default, standalone, and ESM targets in a pnpm/Turbo monorepo.

Code Quality - The package is thoroughly tested, with roughly 120 Vitest unit/integration test files alongside dedicated end-to-end and benchmark suites (test:e2e, test:benchmark) and a strict types:check script. Linting/formatting is enforced via Biome and ESLint with lefthook git hooks, reflecting a mature, well-governed codebase.

API Design - The developer experience is a headline strength: a single HTML file with one script tag and a small configuration object is enough to render a full reference, so time-to-first-result is minimal. Options are consolidated into one clearly-named configuration object, framework integrations (React wrapper, dozens of server-framework adapters) reduce boilerplate, and extensive hosted documentation covers each path.