diff --git a/spiffworkflow-frontend/src/App.tsx b/spiffworkflow-frontend/src/App.tsx
index 186ac513b..2561c2a8e 100644
--- a/spiffworkflow-frontend/src/App.tsx
+++ b/spiffworkflow-frontend/src/App.tsx
@@ -46,28 +46,30 @@ export default function App() {
   }
 
   return (
-    <ErrorContext.Provider value={errorContextValueArray}>
-      <BrowserRouter>
-        <NavigationBar />
-        <Content>
-          {errorTag}
-          <ErrorBoundary>
-            <Routes>
-              <Route path="/" element={<HomePage />} />
-              <Route path="/tasks" element={<HomePage />} />
-              <Route path="/admin/*" element={<AdminRoutes />} />
-              <Route
-                path="/tasks/:process_instance_id/:task_id"
-                element={<TaskShow />}
-              />
-              <Route
-                path="/tasks/:process_instance_id/:task_id"
-                element={<TaskShow />}
-              />
-            </Routes>
-          </ErrorBoundary>
-        </Content>
-      </BrowserRouter>
-    </ErrorContext.Provider>
+    <div className="cds--white">
+      <ErrorContext.Provider value={errorContextValueArray}>
+        <BrowserRouter>
+          <NavigationBar />
+          <Content>
+            {errorTag}
+            <ErrorBoundary>
+              <Routes>
+                <Route path="/" element={<HomePage />} />
+                <Route path="/tasks" element={<HomePage />} />
+                <Route path="/admin/*" element={<AdminRoutes />} />
+                <Route
+                  path="/tasks/:process_instance_id/:task_id"
+                  element={<TaskShow />}
+                />
+                <Route
+                  path="/tasks/:process_instance_id/:task_id"
+                  element={<TaskShow />}
+                />
+              </Routes>
+            </ErrorBoundary>
+          </Content>
+        </BrowserRouter>
+      </ErrorContext.Provider>
+    </div>
   );
 }
diff --git a/spiffworkflow-frontend/src/components/NavigationBar.tsx b/spiffworkflow-frontend/src/components/NavigationBar.tsx
index b3932515e..7ecd7c475 100644
--- a/spiffworkflow-frontend/src/components/NavigationBar.tsx
+++ b/spiffworkflow-frontend/src/components/NavigationBar.tsx
@@ -124,7 +124,6 @@ export default function NavigationBar() {
   };
 
   if (activeKey) {
-    // TODO: apply theme g100 to the header
     return (
       <HeaderContainer
         render={({ isSideNavExpanded, onClickSideNavExpand }: any) => (
diff --git a/spiffworkflow-frontend/src/index.scss b/spiffworkflow-frontend/src/index.scss
index 7ef64a654..ee9ca2c2d 100644
--- a/spiffworkflow-frontend/src/index.scss
+++ b/spiffworkflow-frontend/src/index.scss
@@ -5,6 +5,11 @@
 // @include grid.flex-grid();
 
 // @use '@carbon/react/scss/colors';
-// .cds--header, a.cds--header__menu-item {
-//   background-color: colors.$gray-100;
-// }
+
+// site is mainly using white theme.
+// header is mainly using g100
+// mockup wanted white, not grey, text
+.cds--header, a.cds--header__menu-item {
+  // background-color: colors.$gray-100;
+  color: white;
+}