diff --git a/src/components/cc-button/cc-button.js b/src/components/cc-button/cc-button.js
index 00e506d35..35f4f734b 100644
--- a/src/components/cc-button/cc-button.js
+++ b/src/components/cc-button/cc-button.js
@@ -301,6 +301,7 @@ export class CcButton extends LitElement {
           min-height: 2em;
           padding: 0 0.5em;
           border: 1px solid #000;
+          background-color: var(--cc-color-bg-default, #fff);
           border-radius: var(--cc-button-border-radius, 0.15em);
           cursor: pointer;
           font-weight: var(--cc-button-font-weight, bold);
@@ -342,7 +343,7 @@ export class CcButton extends LitElement {
         }
 
         .outlined {
-          background-color: transparent;
+          background-color: var(--cc-color-bg-default, #fff);
           color: var(--btn-color);
         }