diff --git a/dev/theme-integration.md b/dev/theme-integration.md
index 65be0ba..baa10ad 100644
--- a/dev/theme-integration.md
+++ b/dev/theme-integration.md
@@ -15,6 +15,7 @@
 | `--halo-cw-primary-1-color`  | 主要的主题色，用于按钮背景，输入框边框等 |
 | `--halo-cw-primary-2-color`  | 较浅的主题色                             |
 | `--halo-cw-primary-3-color`  | 最浅的主题色                             |
+| `--halo-cw-primary-contrast-color` | 主要主题色上的文字颜色（提交按钮等） |
 | `--halo-cw-text-1-color`     | 主要文本颜色，用于标题、正文等           |
 | `--halo-cw-text-2-color`     | 次要文本颜色                             |
 | `--halo-cw-text-3-color`     | 辅助文本颜色                             |
@@ -35,6 +36,7 @@
   --halo-cw-primary-1-color: ;
   --halo-cw-primary-2-color: ;
   --halo-cw-primary-3-color: ;
+  --halo-cw-primary-contrast-color: ;
 
   --halo-cw-text-1-color: ;
   --halo-cw-text-2-color: ;
@@ -76,7 +78,7 @@
 | `--halo-comment-widget-component-form-button-login-bg-color-hover`      | 登录按钮悬停背景颜色     | 已废弃                                             |
 | `--halo-comment-widget-component-form-button-login-border-color`        | 登录按钮边框颜色         | 已废弃                                             |
 | `--halo-comment-widget-component-form-button-submit-bg-color`           | 提交按钮背景颜色         | 已废弃，后续使用 `--halo-cw-primary-1-color` 代替  |
-| `--halo-comment-widget-component-form-button-submit-color`              | 提交按钮文字颜色         | 已废弃                                             |
+| `--halo-comment-widget-component-form-button-submit-color`              | 提交按钮文字颜色         | 已废弃，后续使用 `--halo-cw-primary-contrast-color` 代替 |
 | `--halo-comment-widget-component-form-button-submit-border-color`       | 提交按钮边框颜色         | 已废弃                                             |
 | `--halo-comment-widget-component-form-button-submit-border-color-hover` | 提交按钮悬停边框颜色     | 已废弃，后续使用 `--halo-cw-primary-3-color` 代替  |
 | `--halo-comment-widget-component-form-button-emoji-color`               | 表情按钮颜色             | 已废弃                                             |
diff --git a/packages/comment-widget/src/base-form.ts b/packages/comment-widget/src/base-form.ts
index 655b7f0..dd81830 100644
--- a/packages/comment-widget/src/base-form.ts
+++ b/packages/comment-widget/src/base-form.ts
@@ -546,7 +546,7 @@ export class BaseForm extends LitElement {
             <button
               .disabled=${this.busy}
               type="submit"
-              class="form-submit outline-none focus-visible:shadow-input h-12 text-sm inline-flex border border-primary-1 border-solid items-center justify-center gap-2 bg-primary-1 text-white px-3 rounded-base hover:opacity-80 transition-[opacity,box-shadow]"
+              class="form-submit outline-none focus-visible:shadow-input h-12 text-sm inline-flex border border-primary-1 border-solid items-center justify-center gap-2 bg-primary-1 text-primary-contrast px-3 rounded-base hover:opacity-80 transition-[opacity,box-shadow]"
             >
               ${when(
                 this.showLoading,
diff --git a/packages/comment-widget/src/comment-edit-form.ts b/packages/comment-widget/src/comment-edit-form.ts
index 2829c65..d81ad1c 100644
--- a/packages/comment-widget/src/comment-edit-form.ts
+++ b/packages/comment-widget/src/comment-edit-form.ts
@@ -257,7 +257,7 @@ export class CommentEditForm extends LitElement {
           <button
             type="button"
             @click=${() => void this.loadLatest()}
-            class="edit-form-retry outline-none focus-visible:shadow-input h-9 text-sm inline-flex items-center justify-center gap-2 bg-primary-1 text-white px-4 rounded-base hover:opacity-80 transition-[opacity,box-shadow]"
+            class="edit-form-retry outline-none focus-visible:shadow-input h-9 text-sm inline-flex items-center justify-center gap-2 bg-primary-1 text-primary-contrast px-4 rounded-base hover:opacity-80 transition-[opacity,box-shadow]"
           >
             ${msg('Retry')}
           </button>
@@ -282,7 +282,7 @@ export class CommentEditForm extends LitElement {
           type="button"
           ?disabled=${!this.canSave}
           @click=${this.handleSave}
-          class="edit-form-submit outline-none focus-visible:shadow-input h-9 text-sm inline-flex items-center justify-center gap-2 bg-primary-1 text-white px-4 rounded-base hover:opacity-80 transition-[opacity,box-shadow] disabled:opacity-50 disabled:cursor-not-allowed"
+          class="edit-form-submit outline-none focus-visible:shadow-input h-9 text-sm inline-flex items-center justify-center gap-2 bg-primary-1 text-primary-contrast px-4 rounded-base hover:opacity-80 transition-[opacity,box-shadow] disabled:opacity-50 disabled:cursor-not-allowed"
         >
           ${when(this.saving, () => html`<icon-loading></icon-loading>`)}
           ${msg('Save')}
diff --git a/packages/comment-widget/uno.config.ts b/packages/comment-widget/uno.config.ts
index b8e9bd5..7cd315d 100644
--- a/packages/comment-widget/uno.config.ts
+++ b/packages/comment-widget/uno.config.ts
@@ -35,6 +35,7 @@ export default defineConfig({
         1: 'var(--halo-cw-primary-1-color, #4CCBA0)',
         2: 'var(--halo-cw-primary-2-color, #6EE7B7)',
         3: 'var(--halo-cw-primary-3-color, #99F6E4)',
+        contrast: 'var(--halo-cw-primary-contrast-color, #ffffff)',
       },
       text: {
         1: 'var(--halo-cw-text-1-color, #0f172a)',