diff --git a/.gitignore b/.gitignore
index bf31cb5..95bbfab 100755
--- a/.gitignore
+++ b/.gitignore
@@ -28,6 +28,7 @@ coverage
 yarn.lock
 package-lock.json
 .doc/
+.vscode/
 
 # umi
 .umi
diff --git a/assets/index.less b/assets/index.less
index 62ca71c..0a59c7c 100644
--- a/assets/index.less
+++ b/assets/index.less
@@ -69,6 +69,12 @@
       }
     }
 
+    &-full &-first {
+      width: 100%;
+      color: @rate-star-color;
+      opacity: 1;
+    }
+
     &-half &-first,
     &-half &-second {
       opacity: 1;
diff --git a/src/Rate.tsx b/src/Rate.tsx
index ad8e18e..70612d5 100644
--- a/src/Rate.tsx
+++ b/src/Rate.tsx
@@ -9,7 +9,10 @@ import useRefs from './useRefs';
 import { getOffsetLeft } from './util';
 
 export interface RateProps
-  extends Pick<StarProps, 'count' | 'character' | 'characterRender' | 'allowHalf' | 'disabled'> {
+  extends Pick<
+    StarProps,
+    'count' | 'character' | 'characterRender' | 'allowHalf' | 'disabled' | 'emptyCharacter'
+  > {
   value?: number;
   defaultValue?: number;
   allowClear?: boolean;
@@ -50,6 +53,7 @@ function Rate(props: RateProps, ref: React.Ref<RateRef>) {
     // Display
     character = '★',
     characterRender,
+    emptyCharacter,
 
     // Meta
     disabled,
@@ -229,6 +233,7 @@ function Rate(props: RateProps, ref: React.Ref<RateRef>) {
         onHover={onHover}
         key={item || index}
         character={character}
+        emptyCharacter={emptyCharacter}
         characterRender={characterRender}
         focused={focused}
       />
diff --git a/src/Star.tsx b/src/Star.tsx
index 7243069..04ceb6a 100644
--- a/src/Star.tsx
+++ b/src/Star.tsx
@@ -17,6 +17,7 @@ export interface StarProps {
   characterRender?: (origin: React.ReactElement, props: StarProps) => React.ReactNode;
   focused?: boolean;
   count?: number;
+  emptyCharacter?: React.ReactNode | ((props: StarProps) => React.ReactNode);
 }
 
 function Star(props: StarProps, ref: React.Ref<HTMLLIElement>) {
@@ -32,6 +33,7 @@ function Star(props: StarProps, ref: React.Ref<HTMLLIElement>) {
     focused,
     onHover,
     onClick,
+    emptyCharacter,
   } = props;
 
   // =========================== Events ===========================
@@ -76,6 +78,9 @@ function Star(props: StarProps, ref: React.Ref<HTMLLIElement>) {
 
   // >>>>> Node
   const characterNode = typeof character === 'function' ? character(props) : character;
+  const emptyCharacterNode =
+    typeof emptyCharacter === 'function' ? emptyCharacter(props) : emptyCharacter;
+
   let start: React.ReactNode = (
     <li className={classNames(Array.from(classNameList))} ref={ref}>
       <div
@@ -89,7 +94,7 @@ function Star(props: StarProps, ref: React.Ref<HTMLLIElement>) {
         tabIndex={disabled ? -1 : 0}
       >
         <div className={`${prefixCls}-first`}>{characterNode}</div>
-        <div className={`${prefixCls}-second`}>{characterNode}</div>
+        <div className={`${prefixCls}-second`}>{emptyCharacterNode || characterNode}</div>
       </div>
     </li>
   );