diff --git a/packages/comment-widget/package.json b/packages/comment-widget/package.json
index 70fa85d..30befc9 100644
--- a/packages/comment-widget/package.json
+++ b/packages/comment-widget/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@halo-dev/comment-widget",
-  "version": "1.3.0",
+  "version": "2.1.0",
   "author": {
     "name": "Halo",
     "url": "https://github.com/halo-dev"
diff --git a/packages/comment-widget/src/avatar/avatar-policy.ts b/packages/comment-widget/src/avatar/avatar-policy.ts
new file mode 100644
index 0000000..1cc4b56
--- /dev/null
+++ b/packages/comment-widget/src/avatar/avatar-policy.ts
@@ -0,0 +1,85 @@
+import { CommentVo, ReplyVo } from '@halo-dev/api-client';
+import { getAvatarProvider } from './providers';
+
+abstract class AvatarPolicy {
+  abstract applyCommentPolicy(comment: CommentVo | undefined): string | undefined;
+  abstract applyReplyPolicy(reply: ReplyVo | undefined): string | undefined;
+}
+
+let policyInstance: AvatarPolicy | undefined;
+const emailKind = 'Email';
+const emailHash = 'email-hash';
+
+class AnonymousUserPolicy extends AvatarPolicy {
+  applyCommentPolicy(comment: CommentVo | undefined): string | undefined {
+    const avatarProvider = getAvatarProvider();
+    const isAnonymous = comment?.owner.kind === emailKind;
+    if (isAnonymous) {
+      return avatarProvider?.getAvatarSrc(comment?.spec.owner.annotations?.[emailHash]);
+    }
+    return comment?.owner.avatar;
+  }
+  applyReplyPolicy(reply: ReplyVo | undefined): string | undefined {
+    const avatarProvider = getAvatarProvider();
+    const isAnonymous = reply?.owner.kind === emailKind;
+    if (isAnonymous) {
+      return avatarProvider?.getAvatarSrc(reply?.spec.owner.annotations?.[emailHash]);
+    }
+    return reply?.owner.avatar;
+  }
+}
+
+class AllUserPolicy extends AvatarPolicy {
+  applyCommentPolicy(comment: CommentVo | undefined): string | undefined {
+    const avatarProvider = getAvatarProvider();
+    return avatarProvider?.getAvatarSrc(comment?.spec.owner.annotations?.[emailHash]);
+  }
+  applyReplyPolicy(reply: ReplyVo | undefined): string | undefined {
+    const avatarProvider = getAvatarProvider();
+    return avatarProvider?.getAvatarSrc(reply?.spec.owner.annotations?.[emailHash]);
+  }
+}
+
+class NoAvatarUserPolicy extends AvatarPolicy {
+  applyCommentPolicy(comment: CommentVo | undefined): string | undefined {
+    const avatarProvider = getAvatarProvider();
+    const isAnonymous = comment?.owner.kind === emailKind;
+    const avatar = comment?.owner.avatar;
+    if (isAnonymous || !avatar) {
+      return avatarProvider?.getAvatarSrc(comment?.spec.owner.annotations?.[emailHash]);
+    }
+    return avatar;
+  }
+  applyReplyPolicy(reply: ReplyVo | undefined): string | undefined {
+    const avatarProvider = getAvatarProvider();
+    const isAnonymous = reply?.owner.kind === emailKind;
+    const avatar = reply?.owner.avatar;
+    if (isAnonymous || !avatar) {
+      return avatarProvider?.getAvatarSrc(reply?.spec.owner.annotations?.[emailHash]);
+    }
+    return avatar;
+  }
+}
+
+enum AvatarPolicyEnum {
+  ANONYMOUS_USER_POLICY = 'anonymousUser',
+  ALL_USER_POLICY = 'allUser',
+  NO_AVATAR_USER_POLICY = 'noAvatarUser',
+}
+
+function setPolicyInstance(nPolicyInstance: AvatarPolicy | undefined) {
+  policyInstance = nPolicyInstance;
+}
+
+function getPolicyInstance(): AvatarPolicy | undefined {
+  return policyInstance;
+}
+
+export {
+  AnonymousUserPolicy,
+  AllUserPolicy,
+  NoAvatarUserPolicy,
+  AvatarPolicyEnum,
+  setPolicyInstance,
+  getPolicyInstance,
+};
diff --git a/packages/comment-widget/src/avatar/providers/avatar-provider.ts b/packages/comment-widget/src/avatar/providers/avatar-provider.ts
new file mode 100644
index 0000000..6b38042
--- /dev/null
+++ b/packages/comment-widget/src/avatar/providers/avatar-provider.ts
@@ -0,0 +1,23 @@
+export default abstract class AvatarProvider {
+  private readonly _name: string;
+  private _url: string;
+
+  constructor(name: string, url: string) {
+    this._name = name;
+    this._url = url;
+  }
+
+  get url(): string {
+    return this._url;
+  }
+
+  set url(value: string) {
+    this._url = value;
+  }
+
+  get name(): string {
+    return this._name;
+  }
+
+  abstract getAvatarSrc(emailHash: string | undefined): string;
+}
diff --git a/packages/comment-widget/src/avatar/providers/gravatar.ts b/packages/comment-widget/src/avatar/providers/gravatar.ts
new file mode 100644
index 0000000..08da722
--- /dev/null
+++ b/packages/comment-widget/src/avatar/providers/gravatar.ts
@@ -0,0 +1,9 @@
+import AvatarProvider from './avatar-provider';
+
+class Gravatar extends AvatarProvider {
+  override getAvatarSrc(emailHash: string | undefined): string {
+    return `${this.url}/avatar/${emailHash}`;
+  }
+}
+
+export default new Gravatar('Gravatar', 'https://gravatar.com');
diff --git a/packages/comment-widget/src/avatar/providers/index.ts b/packages/comment-widget/src/avatar/providers/index.ts
new file mode 100644
index 0000000..7723a1c
--- /dev/null
+++ b/packages/comment-widget/src/avatar/providers/index.ts
@@ -0,0 +1,24 @@
+import Gravatar from './gravatar';
+import AvatarProvider from './avatar-provider';
+
+let avatarProvider: AvatarProvider | undefined;
+
+enum AvatarProviderEnum {
+  GRAVATAR = 'gravatar',
+}
+
+export function setAvatarProvider(provider: string, mirrorUrl?: string) {
+  switch (provider) {
+    case AvatarProviderEnum.GRAVATAR:
+      if (mirrorUrl) {
+        Gravatar.url = mirrorUrl;
+      }
+      avatarProvider = Gravatar;
+      break;
+    default:
+  }
+}
+
+export function getAvatarProvider() {
+  return avatarProvider;
+}
diff --git a/packages/comment-widget/src/comment-item.ts b/packages/comment-widget/src/comment-item.ts
index 5404505..25edca7 100644
--- a/packages/comment-widget/src/comment-item.ts
+++ b/packages/comment-widget/src/comment-item.ts
@@ -12,6 +12,7 @@ import { LS_UPVOTED_COMMENTS_KEY } from './constant';
 import varStyles from './styles/var';
 import { Ref, createRef, ref } from 'lit/directives/ref.js';
 import { CommentReplies } from './comment-replies';
+import { getPolicyInstance } from './avatar/avatar-policy';
 
 export class CommentItem extends LitElement {
   @consume({ context: baseUrlContext })
@@ -103,7 +104,7 @@ export class CommentItem extends LitElement {
 
   override render() {
     return html`<base-comment-item
-      .userAvatar="${this.comment?.owner.avatar}"
+      .userAvatar="${handleCommentAvatar(this.comment)}"
       .userDisplayName="${this.comment?.owner.displayName}"
       .content="${this.comment?.spec.content || ''}"
       .creationTime="${this.comment?.spec.creationTime}"
@@ -233,6 +234,14 @@ export class CommentItem extends LitElement {
 
 customElements.get('comment-item') || customElements.define('comment-item', CommentItem);
 
+function handleCommentAvatar(comment: CommentVo | undefined): string | undefined {
+  const avatarPolicy = getPolicyInstance();
+  if (avatarPolicy === undefined) {
+    return comment?.owner.avatar;
+  }
+  return avatarPolicy.applyCommentPolicy(comment);
+}
+
 declare global {
   interface HTMLElementTagNameMap {
     'comment-item': CommentItem;
diff --git a/packages/comment-widget/src/comment-widget.ts b/packages/comment-widget/src/comment-widget.ts
index 66ed188..f349d94 100644
--- a/packages/comment-widget/src/comment-widget.ts
+++ b/packages/comment-widget/src/comment-widget.ts
@@ -5,7 +5,6 @@ import { repeat } from 'lit/directives/repeat.js';
 import baseStyles from './styles/base';
 import { provide } from '@lit/context';
 import {
-  allowAnonymousCommentsContext,
   baseUrlContext,
   currentUserContext,
   emojiDataUrlContext,
@@ -16,12 +15,25 @@ import {
   toastContext,
   versionContext,
   withRepliesContext,
+  allowAnonymousCommentsContext,
+  useAvatarProviderContext,
+  avatarPolicyContext,
+  avatarProviderContext,
+  avatarProviderMirrorContext,
 } from './context';
 import './comment-form';
 import './comment-item';
 import './comment-pagination';
 import varStyles from './styles/var';
 import { ToastManager } from './lit-toast';
+import {
+  AnonymousUserPolicy,
+  AllUserPolicy,
+  NoAvatarUserPolicy,
+  AvatarPolicyEnum,
+  setPolicyInstance,
+} from './avatar/avatar-policy';
+import { setAvatarProvider } from './avatar/providers';
 
 export class CommentWidget extends LitElement {
   @provide({ context: baseUrlContext })
@@ -58,6 +70,22 @@ export class CommentWidget extends LitElement {
   @property({ type: Number, attribute: 'with-reply-size' })
   withReplySize = 10;
 
+  @provide({ context: useAvatarProviderContext })
+  @property({ type: Boolean, attribute: 'use-avatar-provider' })
+  useAvatarProvider = false;
+
+  @provide({ context: avatarProviderContext })
+  @property({ type: String, attribute: 'avatar-provider' })
+  avatarProvider = '';
+
+  @provide({ context: avatarProviderMirrorContext })
+  @property({ type: String, attribute: 'avatar-provider-mirror' })
+  avatarProviderMirror = '';
+
+  @provide({ context: avatarPolicyContext })
+  @property({ type: String, attribute: 'avatar-policy' })
+  avatarPolicy = '';
+
   @provide({ context: emojiDataUrlContext })
   @property({ type: String, attribute: 'emoji-data-url' })
   emojiDataUrl = 'https://unpkg.com/@emoji-mart/data';
@@ -203,12 +231,42 @@ export class CommentWidget extends LitElement {
     await this.fetchComments({ scrollIntoView: true });
   }
 
+  initAvatarProvider() {
+    if (!this.useAvatarProvider) {
+      return;
+    }
+    setAvatarProvider(this.avatarProvider, this.avatarProviderMirror);
+  }
+
+  initAvatarPolicy() {
+    if (!this.useAvatarProvider) {
+      console.log(this.useAvatarProvider);
+      setPolicyInstance(undefined);
+      return;
+    }
+    switch (this.avatarPolicy) {
+      case AvatarPolicyEnum.ALL_USER_POLICY: {
+        setPolicyInstance(new AllUserPolicy());
+        break;
+      }
+      case AvatarPolicyEnum.NO_AVATAR_USER_POLICY: {
+        setPolicyInstance(new NoAvatarUserPolicy());
+        break;
+      }
+      case AvatarPolicyEnum.ANONYMOUS_USER_POLICY:
+      default:
+        setPolicyInstance(new AnonymousUserPolicy());
+    }
+  }
+
   override connectedCallback(): void {
     super.connectedCallback();
     this.toastManager = new ToastManager();
     this.fetchCurrentUser();
     this.fetchComments();
     this.fetchGlobalInfo();
+    this.initAvatarProvider();
+    this.initAvatarPolicy();
   }
 
   static override styles = [
diff --git a/packages/comment-widget/src/context/index.ts b/packages/comment-widget/src/context/index.ts
index 9006355..5d7d01b 100644
--- a/packages/comment-widget/src/context/index.ts
+++ b/packages/comment-widget/src/context/index.ts
@@ -9,6 +9,10 @@ export const nameContext = createContext<string>(Symbol('name'));
 export const versionContext = createContext<string>(Symbol('version'));
 export const replySizeContext = createContext<number>(Symbol('replySize'));
 export const withRepliesContext = createContext<boolean>(Symbol('withReplies'));
+export const useAvatarProviderContext = createContext<boolean>(Symbol('useAvatarProvider'));
+export const avatarProviderContext = createContext<string>(Symbol('avatarProvider'));
+export const avatarProviderMirrorContext = createContext<string>(Symbol('avatarProviderMirror'));
+export const avatarPolicyContext = createContext<string>(Symbol('avatarPolicy'));
 
 export const allowAnonymousCommentsContext = createContext<boolean>(
   Symbol('allowAnonymousComments')
diff --git a/packages/comment-widget/src/emoji-button.ts b/packages/comment-widget/src/emoji-button.ts
index 104ea0e..19303cd 100644
--- a/packages/comment-widget/src/emoji-button.ts
+++ b/packages/comment-widget/src/emoji-button.ts
@@ -83,7 +83,7 @@ export class EmojiButton extends LitElement {
   }
 
   override render() {
-    return html`<button class="emoji-button" type="button">
+    return html`<button class="emoji-button" type="button" aria-label="选择表情">
       ${this.emojiLoading
         ? html`<icon-loading></icon-loading>`
         : html`<icon-emoji @click=${this.handleOpenEmojiPicker}></icon-emoji>`}
diff --git a/packages/comment-widget/src/reply-item.ts b/packages/comment-widget/src/reply-item.ts
index ef93c56..dd1b639 100644
--- a/packages/comment-widget/src/reply-item.ts
+++ b/packages/comment-widget/src/reply-item.ts
@@ -10,6 +10,7 @@ import { LS_UPVOTED_REPLIES_KEY } from './constant';
 import { consume } from '@lit/context';
 import { baseUrlContext } from './context';
 import varStyles from './styles/var';
+import { getPolicyInstance } from './avatar/avatar-policy';
 
 export class ReplyItem extends LitElement {
   @consume({ context: baseUrlContext })
@@ -106,7 +107,7 @@ export class ReplyItem extends LitElement {
   override render() {
     return html`
       <base-comment-item
-        .userAvatar="${this.reply?.owner.avatar}"
+        .userAvatar="${handleReplyAvatar(this.reply)}"
         .userDisplayName="${this.reply?.owner.displayName}"
         .content="${this.reply?.spec.content || ''}"
         .creationTime="${this.reply?.metadata.creationTimestamp ?? undefined}"
@@ -248,6 +249,14 @@ export class ReplyItem extends LitElement {
 
 customElements.get('reply-item') || customElements.define('reply-item', ReplyItem);
 
+function handleReplyAvatar(reply: ReplyVo | undefined): string | undefined {
+  const avatarPolicy = getPolicyInstance();
+  if (avatarPolicy === undefined) {
+    return reply?.owner.avatar;
+  }
+  return avatarPolicy.applyReplyPolicy(reply);
+}
+
 declare global {
   interface HTMLElementTagNameMap {
     'reply-item': ReplyItem;
diff --git a/packages/widget/src/index.ts b/packages/widget/src/index.ts
index 9551372..1e32d95 100644
--- a/packages/widget/src/index.ts
+++ b/packages/widget/src/index.ts
@@ -11,6 +11,10 @@ interface Props {
   replySize?: number;
   withReplies?: boolean;
   withReplySize?: number;
+  useAvatarProvider: boolean;
+  avatarProvider?: string;
+  avatarProviderMirror?: string;
+  avatarPolicy?: string;
 }
 
 export function init(el: string, props: Props) {
@@ -34,6 +38,10 @@ export function init(el: string, props: Props) {
   commentWidget.withReplySize = props.withReplySize || 10;
   commentWidget.emojiDataUrl =
     '/plugins/PluginCommentWidget/assets/static/emoji/native.json';
+  commentWidget.useAvatarProvider = props.useAvatarProvider || false;
+  commentWidget.avatarProvider = props.avatarProvider || '';
+  commentWidget.avatarProviderMirror = props.avatarProviderMirror || '';
+  commentWidget.avatarPolicy = props.avatarPolicy || '';
 
   const observer = new IntersectionObserver((entries) => {
     entries.forEach((entry) => {
diff --git a/src/main/java/run/halo/comment/widget/CommentWidgetPlugin.java b/src/main/java/run/halo/comment/widget/CommentWidgetPlugin.java
index de7b759..b83d35e 100644
--- a/src/main/java/run/halo/comment/widget/CommentWidgetPlugin.java
+++ b/src/main/java/run/halo/comment/widget/CommentWidgetPlugin.java
@@ -2,7 +2,6 @@
 
 import org.pf4j.PluginWrapper;
 import org.springframework.stereotype.Component;
-import run.halo.app.extension.SchemeManager;
 import run.halo.app.plugin.BasePlugin;
 
 /**
@@ -11,10 +10,10 @@
  */
 @Component
 public class CommentWidgetPlugin extends BasePlugin {
-
     public CommentWidgetPlugin(PluginWrapper wrapper) {
         super(wrapper);
     }
+
     @Override
     public void start() {
     }
diff --git a/src/main/java/run/halo/comment/widget/DefaultCommentWidget.java b/src/main/java/run/halo/comment/widget/DefaultCommentWidget.java
index 04501e7..9dd7948 100644
--- a/src/main/java/run/halo/comment/widget/DefaultCommentWidget.java
+++ b/src/main/java/run/halo/comment/widget/DefaultCommentWidget.java
@@ -66,12 +66,19 @@ private String commentHtml(IAttribute groupAttribute, IAttribute kindAttribute,
 
         var basicConfig = settingFetcher.fetch(BasicConfig.GROUP, BasicConfig.class)
                 .orElse(new BasicConfig());
-        // placeholderHelper only support string, so we need to convert boolean to string
         properties.setProperty("size", String.valueOf(basicConfig.getSize()));
         properties.setProperty("replySize", String.valueOf(basicConfig.getReplySize()));
         properties.setProperty("withReplies", String.valueOf(basicConfig.isWithReplies()));
         properties.setProperty("withReplySize", String.valueOf(basicConfig.getWithReplySize()));
 
+        var avatarConfig = settingFetcher.fetch(AvatarConfig.GROUP, AvatarConfig.class)
+                .orElse(new AvatarConfig());
+        properties.setProperty("useAvatarProvider", String.valueOf(avatarConfig.isEnable()));
+        properties.setProperty("avatarProvider", String.valueOf(avatarConfig.getProvider()));
+        properties.setProperty("avatarProviderMirror", String.valueOf(avatarConfig.getProviderMirror()));
+        properties.setProperty("avatarPolicy", String.valueOf(avatarConfig.getPolicy()));
+
+        // placeholderHelper only support string, so we need to convert boolean to string
         return PROPERTY_PLACEHOLDER_HELPER.replacePlaceholders("""
                 <div id="${domId}"></div>
                 <script>
@@ -84,7 +91,11 @@ private String commentHtml(IAttribute groupAttribute, IAttribute kindAttribute,
                       size: ${size},
                       replySize: ${replySize},
                       withReplies: ${withReplies},
-                      withReplySize: ${withReplySize}
+                      withReplySize: ${withReplySize},
+                      useAvatarProvider: ${useAvatarProvider},
+                      avatarProvider: "${avatarProvider}",
+                      avatarProviderMirror: "${avatarProviderMirror}",
+                      avatarPolicy: "${avatarPolicy}",
                     }
                   );
                 </script>
@@ -92,7 +103,7 @@ private String commentHtml(IAttribute groupAttribute, IAttribute kindAttribute,
     }
 
     @Data
-    static class BasicConfig {
+    private static class BasicConfig {
         public static final String GROUP = "basic";
         private int size;
         private int replySize;
@@ -100,6 +111,15 @@ static class BasicConfig {
         private int withReplySize;
     }
 
+    @Data
+    private static class AvatarConfig {
+        public static final String GROUP = "avatar";
+        private boolean enable;
+        private String provider;
+        private String providerMirror;
+        private String policy;
+    }
+
     private String domIdFrom(String group, String kind, String name) {
         Assert.notNull(name, "The name must not be null.");
         Assert.notNull(kind, "The kind must not be null.");
diff --git a/src/main/resources/extensions/settings.yaml b/src/main/resources/extensions/settings.yaml
index aa4be7a..dd02b5e 100644
--- a/src/main/resources/extensions/settings.yaml
+++ b/src/main/resources/extensions/settings.yaml
@@ -31,3 +31,38 @@ spec:
           key: withReplySize
           validation: required
           value: 5
+    - group: avatar
+      label: 头像设置
+      formSchema:
+        - $formkit: checkbox
+          label: 是否启用第三方头像
+          name: enable
+          id: enable
+          key: enable
+          value: false
+        - $formkit: select
+          label: 头像服务提供者
+          if: "$get(enable).value === true"
+          name: provider
+          options:
+            - label: 'Gravatar'
+              value: 'gravatar'
+          value: "gravatar"
+        - $formkit: text
+          label: 头像服务镜像地址
+          if: "$get(enable).value === true"
+          name: providerMirror
+          value: ""
+          help: 使用官方源则留空, 示例：https://gravatar.com
+        - $formkit: select
+          label: 头像策略
+          if: "$get(enable).value === true"
+          name: policy
+          options:
+            - label: '仅匿名用户'
+              value: 'anonymousUser'
+            - label: '所有用户'
+              value: 'allUser'
+            - label: '匿名&无头像用户'
+              value: 'noAvatarUser'
+          value: "anonymousUser"
diff --git a/src/main/resources/plugin.yaml b/src/main/resources/plugin.yaml
index 3ef7c03..00d84b8 100644
--- a/src/main/resources/plugin.yaml
+++ b/src/main/resources/plugin.yaml
@@ -8,7 +8,7 @@ metadata:
     "store.halo.run/app-id": "app-YXyaD"
 spec:
   enabled: true
-  requires: ">=2.14.0"
+  requires: ">=2.15.0"
   author:
     name: Halo OSS Team
     website: https://github.com/halo-dev