diff --git a/app/styles/_variables.scss b/app/styles/_variables.scss
index ad3db282b2..429d3ae29a 100644
--- a/app/styles/_variables.scss
+++ b/app/styles/_variables.scss
@@ -175,6 +175,13 @@ $overlay-background-color: rgba(0, 0, 0, 0.4);
   --co-author-tag-background-color: #{$blue-000};
   --co-author-tag-border-color: #{$blue-200};
 
+  /**
+   * Author input (co-authors)
+   */
+  --commit-warning-badge-background-color: #{$gray-000};
+  --commit-warning-badge-border-color: #{$gray-300};
+  --commit-warning-badge-icon-color: #{$gray-900};
+
   /**
    * The height of the title bar area on Win32 platforms
    * If changed, update titleBarHeight in 'app/src/ui/dialog/dialog.tsx'
diff --git a/app/styles/ui/_commit-message-avatar.scss b/app/styles/ui/_commit-message-avatar.scss
index d4367e11c2..09c5647198 100644
--- a/app/styles/ui/_commit-message-avatar.scss
+++ b/app/styles/ui/_commit-message-avatar.scss
@@ -3,16 +3,17 @@
   position: relative;
 
   .warning-badge {
-    background-color: #f6f8fa;
+    background-color: var(--commit-warning-badge-background-color);
+    border: var(--commit-warning-badge-border-color) 1px solid;
     width: 18px;
     height: 18px;
     position: absolute;
     margin-top: -6px;
     margin-left: -7px;
     border-radius: 9px;
-    border: #d1d5da 1px solid;
 
     > svg {
+      color: var(--commit-warning-badge-icon-color);
       height: 10px;
       // With width=100%, the icon will be centered horizontally
       width: 100%;