React and WebView2 inside a Revit plugin: a hybrid UI architecture

WPF is a good fit for the dialogs of a Revit add-in. It is a poor fit for a 3D preview, a streaming chat panel, a timeline or a dashboard. Those are cheap to build on the web and expensive in XAML.

WebView2 lets a Revit plugin host a React interface next to its WPF windows. This guide covers when to use which, how to design the host, and what goes wrong in practice.

Why the question is urgent

For years many add-ins rendered HTML through the CefSharp browser that Revit itself shipped. That option is gone. Autodesk's SDK notes state that the CefSharp dependency was fully removed from Revit as of the 2026 release, and Autodesk recommends WebView2 instead.

An add-in can still bundle its own CefSharp. Two add-ins that bundle different versions in one Revit session are a known source of crashes.

WPF or web: a split that works

Both layers should read colours, type and spacing from one token file. The user should not be able to tell where WPF ends and the web begins.

Host design: nine rules

1. One environment per Revit process, created lazily. Create the WebView2 environment when the first web panel opens, not when Revit starts.
2. A user data folder you can write to. Use a folder under the user's local application data. Program Files is read-only, and from Revit 2027 that is where all-users add-ins live.
3. Local content only. The React build ships next to the add-in DLL and is served through a virtual host name. No CDN, so panels work offline.
4. Locked navigation. Allow the virtual host and nothing else. External links open in the system browser. Developer tools are off in release builds.
5. A typed message contract. A JSON envelope with an id, a type and a payload. TypeScript types are generated from the same JSON Schema the C# side validates against.
6. One command queue. Web panels never call the Revit API directly. Requests go through an external event queue, with preview, confirmation and a single Undo entry.
7. Large data off the message channel. Geometry goes to a file in a mapped folder or through a shared buffer, not through JSON.
8. One theme. CSS variables are generated from the same tokens as the XAML resources, and the panel switches when Revit's theme changes.
9. A development mode. Debug builds may load a dev server with hot reload. Release builds load the local bundle only.

Small typed messages cross the bridge; heavy geometry travels as cached GLB files the panel reads directly.

Rules 2 to 4 in code:

var env = await CoreWebView2Environment.CreateAsync(
    userDataFolder: Path.Combine(localAppData, "Vendor", "Product", "WebView2"));
await webView.EnsureCoreWebView2Async(env);

webView.CoreWebView2.SetVirtualHostNameToFolderMapping(
    "app.plugin.local", webRoot, CoreWebView2HostResourceAccessKind.Allow);

webView.CoreWebView2.NavigationStarting += (s, e) =>
{
    if (!e.Uri.StartsWith("https://app.plugin.local/")) e.Cancel = true;
};

webView.Source = new Uri("https://app.plugin.local/index.html");

3D previews without the cloud

A web panel makes it practical to show geometry inside a result list, for example the two elements of a clash.

1. On the Revit API thread, read the geometry of the elements and tessellate it, applying the transforms of linked models.
2. Write a small GLB file per result to a local cache. Key it by element identity and version, so reopening is instant.
3. Render it in the panel with Three.js: rotate, colour by status, fade the surroundings.
4. Keep a "Show in Revit" button that opens a native 3D view with a section box.

The geometry never leaves the machine. A cloud viewer would require uploading the model, which many project agreements do not allow.

What goes wrong

The second row is not theoretical. A WebView2 runtime update in March 2026 conflicted with the browser component used by Revit 2025 and older, and add-ins crashed. One reseller published a workaround that pins an older runtime for Revit. Your support team should know it exists.

Acceptance criteria worth copying

• Two open web panels share one environment.
• Revit starts no slower with the add-in installed.
• The add-in works for a user without administrator rights.
• Every web panel opens with the network cable unplugged.
• A message that fails schema validation is rejected and logged.
• No message handler calls the Revit API directly.
• Switching Revit's theme restyles the panels without a restart.
• Without the runtime, the rest of the add-in still works.
• Runtime and SDK versions appear in the diagnostics a user can copy.

How we use it

This is the design we chose for our own multi-tool Revit plugin. Dialogs stay in WPF. Clash results with 3D preview, the AI panel and the 4D timeline are React panels in one shared host. The same command queue also serves AI agents, as described in Revit MCP in production.

If you are moving an add-in off CefSharp, or planning a web interface inside Revit, book a Feasibility Review. You get a written verdict on the approach, the version risks and what production involves. Related: plugin development and web BIM applications.

FAQ

Can I still use CefSharp in a Revit add-in?

Yes, if you ship it with your add-in. Revit no longer includes it, and different CefSharp versions from different add-ins can conflict.

Is WPF obsolete for Revit add-ins?

No. WPF remains the best choice for dialogs and forms. The web layer earns its place for 3D, streaming content and interfaces you also want on the web.

Can the web interface call the Revit API directly?

No. It sends a message to the C# side, which queues the work for Revit's API thread through an external event.

Does a WebView2 panel work offline?

Yes, if the interface is bundled with the add-in and served from a local folder.