Kubb 5.x · API spec to code 10.7M yearly downloads
Turn your API spec into type-safe code.
Kubb is an open source code generator. Point it at your API spec and get TypeScript types, fetch or axios clients, TanStack Query and SWR hooks, Zod schemas and MSW mocks, always in sync with your API.
Get started
npx kubb init
- Open source, MIT licensed
- OpenAPI 2.0, 3.0, 3.1 and 3.2
- Runs anywhere Node runs
- Set up with your AI assistant
petStore.yaml
Pet:
type: object
required: [id, name]
properties:
id: { type: integer }
name: { type: string }
status:
type: string
enum: [available, pending, sold]export type Pet = {
id: number
name: string
status?: PetStatusEnumKey
}$ kubb generate · no changes✓ in sync
Why Kubb
Hand-written API code drifts. Generated code can't.
Every team that talks to an API writes the same layers by hand, and they slowly fall out of step with the backend.
Without Kubb
Types drift from the API
Someone copies a response into an interface. Months later the backend renames a field and nothing complains.
interface Pet {
id: number
name: string // the API sends petName now
}With Kubb
Generated from the spec
Types come from the spec on every run. A rename shows up as a compile error where your code reads the field.
import type { Pet } from './gen/types/Pet'How it works
Four steps, then it runs on every change.
An adapter, a shared AST and parsers do the work underneath. You only meet them when you write your own plugin.
1 · Point at your spec
A local file or a URL. Run npx kubb init and it writes kubb.config.ts for you.
2 · Pick your plugins
List the layers your stack uses. Each plugin adds one kind of file: types, clients, hooks, schemas or mocks.
See it in action
One operation in your spec. Every layer generated.
Every plugin reads the same parsed operation, so names and types line up across files. Pick a layer to see the file Kubb writes for it.
export const petStatusEnum = {
available: 'available',
pending: 'pending',
sold: 'sold',
} as const
export type PetStatusEnumKey = (typeof petStatusEnum)[keyof typeof petStatusEnum]
export type Pet = {
id: number
name: string
status?: PetStatusEnumKey
}Try it live
Run Kubb in your browser.
Start Node in this tab, install Kubb with npm ci and run kubb generate --watch on a Pet Store spec. Edit the spec, then watch the generated type and the type check of the code that reads it. Setup takes about a minute.
Runs in a WebContainer in this tab, with Kubb telemetry off. Your edits never leave the page, and closing the tab stops it.
Pick your stack
Only generate what you use.
Choose your layers and see the config you would write and the files Kubb would generate.
HTTP client
Data fetching
Validation
Mocks
import { defineConfig } from 'kubb/config'
import { pluginTs } from '@kubb/plugin-ts'
import { pluginFetch } from '@kubb/plugin-fetch'
import { pluginReactQuery } from '@kubb/plugin-react-query'
import { pluginZod } from '@kubb/plugin-zod'
export default defineConfig({
input: './petStore.yaml',
output: { path: './src/gen', clean: true },
plugins: [
pluginTs(),
pluginFetch(),
pluginReactQuery(),
pluginZod(),
],
})- src/gen/# plus an index.ts barrel in every folder
- types/# plugin-ts
- Pet.ts
- GetPetById.ts
- clients/# plugin-fetch
- getPetById.ts
- hooks/# plugin-react-query
- useGetPetById.ts
- zod/# plugin-zod
- petSchema.ts
- index.ts
- types/# plugin-ts
Ecosystem
Adapters, plugins and parsers
Mix and match the plugins your stack needs, or write your own with the same API the official ones use.
Plugins
14 official plugins. Each one writes one kind of file.
- plugin-axiosAxios
- plugin-barrelBarrel
- plugin-clientClient
- plugin-cypressCypress
- plugin-fakerFaker
- plugin-fetchFetch
- plugin-mcpMCP
- plugin-mswMSW
- plugin-react-queryReact Query
- plugin-redocRedoc
- plugin-swrSWR
- plugin-tsTypeScript
- plugin-vue-queryVue Query
- plugin-zodZod
Review every generated change in Kubb Studio.
Connect the Kubb CLI or a Docker agent, generate from the browser and diff the output before it reaches your repository. Code stays on machines you control unless you allow Studio to read it.
export type Pet = {
id: number
name: string
petName: string
status?: PetStatusEnumKey
}Sponsors
Keep Kubb free and independent
Kubb is MIT licensed and maintained in the open. Sponsorships pay for maintenance, releases and new plugins, and your logo reaches every developer who reads these docs.
Gold Sponsor
Bug and feature prioritization for Kubb.
$500
/month
- A free Kubb Studio Pro subscription.
- Bug prioritization for Kubb.
- Feature prioritization for Kubb.
- Your avatar will be visible as Gold on all major projects.
- Your avatar will be visible as Gold on the home page of kubb.
Silver Sponsor
Visibility on all major Kubb projects.
$250
/month
- A free Kubb Studio Pro subscription.
- Your avatar will be visible as Silver on all major projects.
- Your avatar will be visible as Silver on the home page of kubb.
Bronze Sponsor
You are serious about supporting Kubb!
$100
/month
- A free Kubb Studio Pro subscription.
- Your avatar will be visible as Bronze on my major projects.
- Your avatar will be visible as Bronze on the home page of kubb.
Generate your first client in minutes.
Run npx kubb init, point it at your API spec and get type-safe code.
