diff --git a/packages/app-shell/src/color-mode.js b/packages/app-shell/src/color-mode.js
index e4b9446459e63896e6c6c490ad098ff585c2a644..e8dfc5059e50f837971fa495fce623409d69d782 100644
--- a/packages/app-shell/src/color-mode.js
+++ b/packages/app-shell/src/color-mode.js
@@ -46,6 +46,7 @@ export class ColorMode extends ScopedElementsMixin(DBPLitElement) {
     connectedCallback() {
         super.connectedCallback();
         this.updateComplete.then(() => {
+            this.loadTheme("light-theme");
             this.detectInitialMode();
         });
 
@@ -182,6 +183,7 @@ export class ColorMode extends ScopedElementsMixin(DBPLitElement) {
               position: absolute;
               background-color: var(--dbp-base);
               z-index: 1000;
+              boader-radius: var(--dbp-border-radius);
             }
             
             .extended-menu li {
diff --git a/packages/common/dbp-common-demo.js b/packages/common/dbp-common-demo.js
index 4c85bd2320d32bca03d8565c6e35c76edec9ea3f..5b5b2ad38126675bd502790353d7f3fa6973266d 100644
--- a/packages/common/dbp-common-demo.js
+++ b/packages/common/dbp-common-demo.js
@@ -162,10 +162,6 @@ export class DbpCommonDemo extends ScopedElementsMixin(LitElement) {
                     <h2>Theming CSS API</h2>
                     <div class="control">
                         <ul>
-                            <li><code>--dbp-primary-light</code>: Primary Light color <div class="demoblock" style="background-color: var(--dbp-primary-light); color: var(--dbp-text)">X</div></li>
-                            <li><code>--dbp-primary-base</code>: Primary dark color <div class="demoblock" style="background-color: var(--dbp-primary-base); color: var(--dbp-override-text-light);">X</div></li>
-                            <li><code>--dbp-primary-base</code>: secondary Light color <div class="demoblock" style="background-color: var(--dbp-primary-base); color: var(--dbp-text)">X</div></li>
-                            <li><code>--dbp-primary-base</code>: secondary dark color <div class="demoblock" style="background-color: var(--dbp-primary-base); color: var(--dbp-override-text-light);">X</div></li>
                             <!-- TODO -->
                             <!-- old
                             <li><code>--dbp-primary-bg-color</code>: Primary background color <div class="demoblock" style="background-color: var(--dbp-primary-bg-color)"></div></li>
diff --git a/packages/common/styles.js b/packages/common/styles.js
index dfbb60da098641b70dbfe5b4f808fadbcc713390..cf73963fe143205b391caca326bb1fa53b3668a4 100644
--- a/packages/common/styles.js
+++ b/packages/common/styles.js
@@ -806,7 +806,7 @@ export function getTagCSS() {
             align-items: center;
             background-color: var(--dbp-text-muted);
             border-radius: var(--dbp-border-radius);
-            color: #4a4a4a;
+            color: var(--dbp-text-muted);
             display: inline-flex;
             font-size: 0.75rem;
             height: 2em;
@@ -890,11 +890,11 @@ export function getTagCSS() {
         }
 
         .tag:not(body).is-delete:hover, .tag:not(body).is-delete:focus {
-            background-color: #e8e8e8;
+            background-color: var(--dbp-text-inverted);
         }
 
         .tag:not(body).is-delete:active {
-            background-color: #dbdbdb;
+            background-color: var(--dbp-text-inverted);
         }
 
         .tag:not(body).is-rounded {
diff --git a/packages/file-handling/src/nextcloud-file-picker.js b/packages/file-handling/src/nextcloud-file-picker.js
index 9ddf268651dc52a92daac9107b7beb0eb170995e..d47f79d90e921f8f7378f008766cccc75beceb14 100644
--- a/packages/file-handling/src/nextcloud-file-picker.js
+++ b/packages/file-handling/src/nextcloud-file-picker.js
@@ -2428,7 +2428,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
             }
 
             .breadcrumb {
-                border-bottom: var(--dbp-border-dark);
+                border-bottom: var(--dbp-border);
             }
 
             .breadcrumb:last-child, .breadcrumb:first-child {
diff --git a/packages/qr-code-scanner/src/qr-code-scanner.js b/packages/qr-code-scanner/src/qr-code-scanner.js
index e9a95ab00ab06bd9f9c647e3e85fbadb2c53a24f..6849679c02f099852bde46a6c076594e9869e7b6 100644
--- a/packages/qr-code-scanner/src/qr-code-scanner.js
+++ b/packages/qr-code-scanner/src/qr-code-scanner.js
@@ -471,7 +471,7 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
             .border{
                 margin-top: 2rem;
                 padding-top: 2rem;
-                border-top: var(--dbp-border-dark);
+                border-top: var(--dbp-border);
             }
             
             #video video, #video{