diff --git a/app/src/app.config.json.tpl b/app/src/app.config.json.tpl
index 562d4915a..b903d97f7 100644
--- a/app/src/app.config.json.tpl
+++ b/app/src/app.config.json.tpl
@@ -39,7 +39,6 @@
   },
   "viewer.maxRetries": 1,
   "sharedLinkDateTimePickerType": "datetime",
-  "headerColor": "#ffffff",
   "customCssPath": "",
   "webFontPath": "",
   "pagination": {
diff --git a/docs/ja/getting-started/configuration.md b/docs/ja/getting-started/configuration.md
index 4abf60b1d..aa6fd2a28 100644
--- a/docs/ja/getting-started/configuration.md
+++ b/docs/ja/getting-started/configuration.md
@@ -89,16 +89,6 @@ Alfresco コンテンツアプリケーションの左上隅に表示される
 }
 ```
 
-### ヘッダーの背景色
-
-"headerColor" キーの色コードを指定することにより、ヘッダーの背景色を変更できます:
-
-```json
-{
-    "headerColor": "#ffffff"
-}
-```
-
 ### 制限されたコンテンツ
 
 "files.excluded" パスにあるルールのリストを設定または拡張することで、ユーザーが特定の種類のファイルやフォルダをアップロードできないように制限することができます。
diff --git a/projects/aca-content/src/lib/components/header/header.component.spec.ts b/projects/aca-content/src/lib/components/header/header.component.spec.ts
index d9178cb52..a82fa17b3 100644
--- a/projects/aca-content/src/lib/components/header/header.component.spec.ts
+++ b/projects/aca-content/src/lib/components/header/header.component.spec.ts
@@ -53,7 +53,6 @@ describe('AppHeaderComponent', () => {
   } as any;
 
   const app = {
-    headerColor: 'some-color',
     appName: 'name',
     logoPath: 'some/path'
   } as AppState;
@@ -83,7 +82,6 @@ describe('AppHeaderComponent', () => {
   it('should set header color, header text color, name and logo', fakeAsync(() => {
     component.appName$.subscribe((val) => expect(val).toBe(app.appName));
     component.logo$.subscribe((val) => expect(val).toBe(app.logoPath));
-    component.headerColor$.subscribe((val) => expect(val).toBe(app.headerColor));
   }));
 
   it('should get header actions', fakeAsync(() => {
diff --git a/projects/aca-content/src/lib/components/header/header.component.ts b/projects/aca-content/src/lib/components/header/header.component.ts
index 9749859c5..001ee8baa 100644
--- a/projects/aca-content/src/lib/components/header/header.component.ts
+++ b/projects/aca-content/src/lib/components/header/header.component.ts
@@ -27,7 +27,7 @@ import { Component, ViewEncapsulation, Output, EventEmitter, OnInit, Input, OnDe
 import { Store } from '@ngrx/store';
 import { Observable, Subject } from 'rxjs';
 import { ContentActionRef } from '@alfresco/adf-extensions';
-import { AppStore, getHeaderColor, getAppName, getLogoPath } from '@alfresco/aca-shared/store';
+import { AppStore, getAppName, getLogoPath } from '@alfresco/aca-shared/store';
 import { AppExtensionService } from '@alfresco/aca-shared';
 import { takeUntil } from 'rxjs/operators';
 import { AppConfigService, SidenavLayoutComponent } from '@alfresco/adf-core';
@@ -55,14 +55,12 @@ export class AppHeaderComponent implements OnInit, OnDestroy {
   }
 
   appName$: Observable<string>;
-  headerColor$: Observable<any>;
   logo$: Observable<string>;
   landingPage: string;
 
   actions: Array<ContentActionRef> = [];
 
   constructor(public store: Store<AppStore>, private appExtensions: AppExtensionService, private appConfigService: AppConfigService) {
-    this.headerColor$ = store.select(getHeaderColor);
     this.appName$ = store.select(getAppName);
     this.logo$ = store.select(getLogoPath);
     this.landingPage = this.appConfigService.get('landingPage', '/personal-files');
diff --git a/projects/aca-content/src/lib/store/initial-state.ts b/projects/aca-content/src/lib/store/initial-state.ts
index 519ec1c9a..1e17cb189 100644
--- a/projects/aca-content/src/lib/store/initial-state.ts
+++ b/projects/aca-content/src/lib/store/initial-state.ts
@@ -27,7 +27,6 @@ import { AppState, AppStore } from '@alfresco/aca-shared/store';
 
 export const INITIAL_APP_STATE: AppState = {
   appName: 'Alfresco Content Application',
-  headerColor: '#ffffff',
   logoPath: 'assets/images/alfresco-logo-white.svg',
   customCssPath: '',
   webFontPath: '',
diff --git a/projects/aca-content/src/lib/store/reducers/app.reducer.ts b/projects/aca-content/src/lib/store/reducers/app.reducer.ts
index ea07bc509..22bf7df07 100644
--- a/projects/aca-content/src/lib/store/reducers/app.reducer.ts
+++ b/projects/aca-content/src/lib/store/reducers/app.reducer.ts
@@ -35,7 +35,6 @@ import {
   SetRepositoryInfoAction,
   SetInfoDrawerStateAction,
   SetInfoDrawerMetadataAspectAction,
-  SetHeaderColorAction,
   SetCurrentNodeVersionAction,
   SetFileUploadingDialogAction,
   SetInfoDrawerPreviewStateAction,
@@ -51,12 +50,6 @@ export function appReducer(state: AppState = INITIAL_APP_STATE, action: Action):
     case AppActionTypes.SetInitialState:
       newState = Object.assign({}, (action as SetInitialStateAction).payload);
       break;
-    case AppActionTypes.SetHeaderColor:
-      newState = {
-        ...state,
-        headerColor: (action as SetHeaderColorAction).color
-      };
-      break;
     case NodeActionTypes.SetSelection:
       newState = updateSelectedNodes(state, action as SetSelectedNodesAction);
       break;
diff --git a/projects/aca-preview/src/lib/components/preview.component.spec.ts b/projects/aca-preview/src/lib/components/preview.component.spec.ts
index 714ce5175..58449f73f 100644
--- a/projects/aca-preview/src/lib/components/preview.component.spec.ts
+++ b/projects/aca-preview/src/lib/components/preview.component.spec.ts
@@ -61,7 +61,6 @@ class DocumentBasePageServiceMock extends DocumentBasePageService {
 
 export const INITIAL_APP_STATE: AppState = {
   appName: 'Alfresco Content Application',
-  headerColor: '#ffffff',
   logoPath: 'assets/images/alfresco-logo-white.svg',
   customCssPath: '',
   webFontPath: '',
diff --git a/projects/aca-shared/src/lib/components/document-base-page/document-base-page.spec.ts b/projects/aca-shared/src/lib/components/document-base-page/document-base-page.spec.ts
index 810035781..c543c5548 100644
--- a/projects/aca-shared/src/lib/components/document-base-page/document-base-page.spec.ts
+++ b/projects/aca-shared/src/lib/components/document-base-page/document-base-page.spec.ts
@@ -41,7 +41,6 @@ import { EffectsModule } from '@ngrx/effects';
 
 export const INITIAL_APP_STATE: AppState = {
   appName: 'Alfresco Content Application',
-  headerColor: '#ffffff',
   logoPath: 'assets/images/alfresco-logo-white.svg',
   customCssPath: '',
   webFontPath: '',
diff --git a/projects/aca-shared/src/lib/services/app.service.ts b/projects/aca-shared/src/lib/services/app.service.ts
index 2fceeeaa3..675f06cee 100644
--- a/projects/aca-shared/src/lib/services/app.service.ts
+++ b/projects/aca-shared/src/lib/services/app.service.ts
@@ -224,7 +224,6 @@ export class AppService implements OnDestroy {
     const state: AppState = {
       ...this.initialAppState,
       appName: this.config.get<string>('application.name'),
-      headerColor: this.config.get<string>('headerColor'),
       logoPath: this.config.get<string>('application.logo'),
       customCssPath: this.config.get<string>('customCssPath'),
       webFontPath: this.config.get<string>('webFontPath'),
diff --git a/projects/aca-shared/src/lib/testing/lib-testing-module.ts b/projects/aca-shared/src/lib/testing/lib-testing-module.ts
index a49532d80..ec549fdc7 100644
--- a/projects/aca-shared/src/lib/testing/lib-testing-module.ts
+++ b/projects/aca-shared/src/lib/testing/lib-testing-module.ts
@@ -43,7 +43,6 @@ import { CommonModule } from '@angular/common';
 export const initialState = {
   app: {
     appName: 'Alfresco Content Application',
-    headerColor: '#ffffff',
     logoPath: 'assets/images/alfresco-logo-white.svg',
     sharedUrl: '',
     user: {
diff --git a/projects/aca-shared/store/src/actions/app-action-types.ts b/projects/aca-shared/store/src/actions/app-action-types.ts
index 99ce6b475..997761b62 100644
--- a/projects/aca-shared/store/src/actions/app-action-types.ts
+++ b/projects/aca-shared/store/src/actions/app-action-types.ts
@@ -26,7 +26,6 @@
 export enum AppActionTypes {
   SetSettingsParameter = 'SET_SETTINGS_PARAMETER',
   SetInitialState = 'SET_INITIAL_STATE',
-  SetHeaderColor = 'SET_HEADER_COLOR',
   SetCurrentFolder = 'SET_CURRENT_FOLDER',
   SetCurrentVersion = 'SET_CURRENT_VERSION',
   SetCurrentUrl = 'SET_CURRENT_URL',
diff --git a/projects/aca-shared/store/src/actions/app.actions.ts b/projects/aca-shared/store/src/actions/app.actions.ts
index 585394759..c40ba6a12 100644
--- a/projects/aca-shared/store/src/actions/app.actions.ts
+++ b/projects/aca-shared/store/src/actions/app.actions.ts
@@ -40,12 +40,6 @@ export class SetInitialStateAction implements Action {
   constructor(public payload: AppState) {}
 }
 
-export class SetHeaderColorAction implements Action {
-  readonly type = AppActionTypes.SetHeaderColor;
-
-  constructor(public color: string) {}
-}
-
 export class SetCurrentFolderAction implements Action {
   readonly type = AppActionTypes.SetCurrentFolder;
 
diff --git a/projects/aca-shared/store/src/selectors/app.selectors.ts b/projects/aca-shared/store/src/selectors/app.selectors.ts
index 61dd51b5c..1e05a3b55 100644
--- a/projects/aca-shared/store/src/selectors/app.selectors.ts
+++ b/projects/aca-shared/store/src/selectors/app.selectors.ts
@@ -28,7 +28,6 @@ import { createSelector } from '@ngrx/store';
 
 export const selectApp = (state: AppStore) => state.app;
 
-export const getHeaderColor = createSelector(selectApp, (state) => state.headerColor);
 export const getAppName = createSelector(selectApp, (state) => state.appName);
 export const getLogoPath = createSelector(selectApp, (state) => state.logoPath);
 export const getCustomCssPath = createSelector(selectApp, (state) => state.customCssPath);
diff --git a/projects/aca-shared/store/src/states/app.state.ts b/projects/aca-shared/store/src/states/app.state.ts
index fec74ff76..007b19915 100644
--- a/projects/aca-shared/store/src/states/app.state.ts
+++ b/projects/aca-shared/store/src/states/app.state.ts
@@ -31,7 +31,6 @@ export const STORE_INITIAL_APP_DATA = new InjectionToken<AppState>('STORE_INITIA
 
 export interface AppState {
   appName: string;
-  headerColor: string;
   logoPath: string;
   customCssPath: string;
   webFontPath: string;