uigen

Render a SaaS-style UI directly from an OpenAPI specification at runtime

TLDR

Scaffold a new uigen project in the current directory

$ npx @uigen-dev/cli init

Serve the UI from an OpenAPI spec on http://localhost:4400

$ npx @uigen-dev/cli serve [openapi.yaml]

Route API calls to a backend running locally

$ npx @uigen-dev/cli serve [openapi.yaml] --proxy-base [http://localhost:8000]

Bundle for production deployment

$ npx @uigen-dev/cli build --spec [openapi.yaml]

Use an explicit spec flag instead of a positional argument

$ npx @uigen-dev/cli serve --spec [api/openapi.yaml]

SYNOPSIS

uigen subcommand [spec] [options]

uigen is an OpenAPI-to-UI compiler. It reads an OpenAPI 3.x specification, parses it into a framework-agnostic Intermediate Representation containing resources, operations, schemas, authentication flows, and pagination strategies, and renders a complete React frontend at runtime. There is no code-generation step — the rendered UI is recomputed each time the server starts (or on hot reload), so changes to the spec are reflected immediately.Out of the box uigen produces table views with sorting, filtering, and pagination; create and edit forms with validation derived from JSON schemas; detail views with cross-resource links; charts; file uploads; and authentication flows for OAuth 2.0, Bearer tokens, and API keys. Theme customization and AI-native "agent skills" let downstream tools (e.g. Claude Code) extend the generated app without touching generated source files.

PARAMETERS

init

Scaffold a new project including configuration files, agent skills, and an example OpenAPI spec.

serve [spec]

Start a development server rendering the UI from spec at runtime. Defaults to http://localhost:4400.

build [spec]

Produce a production bundle of the rendered UI for static or server-side hosting.

--spec file

Alternative way to specify the OpenAPI file when the subcommand expects no positional argument.

--proxy-base url

Forward API calls made by the rendered UI to a backend at url (useful in local development).

--port n

Override the default development-server port (4400).

CONFIGURATION

uigen.config.json

Project-level configuration written by init: theme overrides, authentication defaults, and renderer plugins.

.uigen/

Cache directory holding the parsed Intermediate Representation between runs.

CAVEATS

Renders React today; Svelte and Vue renderers are on the roadmap but not yet shipped. Because rendering is runtime-only, the OpenAPI spec must remain reachable at startup — there is no compiled JS bundle independent of the spec. Complex polymorphic schemas (deeply nested oneOf/anyOf) may render generically and need manual templates.

HISTORY

uigen was released by darula-hpp in 2026 as part of a broader trend toward spec-driven, AI-native SaaS frontends. It deliberately avoids the boilerplate generated by traditional swagger-codegen by keeping rendering at runtime and is distributed through npm as @uigen-dev/cli.