diff --git a/.changeset/wild-fishes-suffer.md b/.changeset/wild-fishes-suffer.md
new file mode 100644
index 0000000000..5b914860b2
--- /dev/null
+++ b/.changeset/wild-fishes-suffer.md
@@ -0,0 +1,5 @@
+---
+'@backstage/dev-utils': patch
+---
+
+Allow custom theme for dev app.
diff --git a/packages/dev-utils/api-report.md b/packages/dev-utils/api-report.md
index 6790992ecf..5f58b297d5 100644
--- a/packages/dev-utils/api-report.md
+++ b/packages/dev-utils/api-report.md
@@ -6,6 +6,7 @@
 /// <reference types="react" />
 
 import { ApiFactory } from '@backstage/core-plugin-api';
+import { AppTheme } from '@backstage/core-plugin-api';
 import { ComponentType } from 'react';
 import { createPlugin } from '@backstage/core-plugin-api';
 import { Entity } from '@backstage/catalog-model';
diff --git a/packages/dev-utils/src/devApp/render.tsx b/packages/dev-utils/src/devApp/render.tsx
index 508eb105f1..e6338cd467 100644
--- a/packages/dev-utils/src/devApp/render.tsx
+++ b/packages/dev-utils/src/devApp/render.tsx
@@ -37,6 +37,7 @@ import {
 import {
   AnyApiFactory,
   ApiFactory,
+  AppTheme,
   attachComponentData,
   configApiRef,
   createApiFactory,
@@ -79,6 +80,7 @@ class DevAppBuilder {
   private readonly sidebarItems = new Array<JSX.Element>();
 
   private defaultPage?: string;
+  private themes?: Array<AppTheme>;
 
   /**
    * Register one or more plugins to render in the dev app
@@ -144,6 +146,14 @@ class DevAppBuilder {
     return this;
   }
 
+  /**
+   * Adds an array of themes to overide the default theme.
+   */
+  addThemes(themes: AppTheme[]) {
+    this.themes = themes;
+    return this;
+  }
+
   /**
    * Build a DevApp component using the resources registered so far
    */
@@ -166,6 +176,7 @@ class DevAppBuilder {
     const app = createApp({
       apis,
       plugins: this.plugins,
+      themes: this.themes,
       bindRoutes: ({ bind }) => {
         for (const plugin of this.plugins ?? []) {
           const targets: Record<string, RouteRef<any>> = {};