diff --git a/.changeset/metal-readers-drum.md b/.changeset/metal-readers-drum.md
new file mode 100644
index 000000000..93a4916b4
--- /dev/null
+++ b/.changeset/metal-readers-drum.md
@@ -0,0 +1,5 @@
+---
+'@ice/cache-canvas': patch
+---
+
+fix: fix style not match when hydrate
diff --git a/packages/cache-canvas/src/index.tsx b/packages/cache-canvas/src/index.tsx
index 517158191..4c351e5af 100644
--- a/packages/cache-canvas/src/index.tsx
+++ b/packages/cache-canvas/src/index.tsx
@@ -119,10 +119,9 @@ export const CacheCanvas = forwardRef((props: CacheCanvasProps, ref) => {
           {
             (typeof fallback === 'function') && (<div
               id={`fallback-${id}`}
-              style={isNode || Storage.getItem(cacheKey, { bizID }) ? { display: 'none' } : { display: 'block' }}
             >
               {
-                fallback()
+                (isNode || !Storage.getItem(cacheKey, { bizID })) && fallback()
               }
             </div>)
           }
@@ -155,9 +154,9 @@ export const CacheCanvas = forwardRef((props: CacheCanvasProps, ref) => {
                   if (base64Data) {
                     const img = document.getElementById('canvas-img-${id}');
                     img && (img.src = base64Data);
-                    fallback && (fallback.style.display = 'none');
-                  } else {
-                    fallback && (fallback.style.display = 'block');
+                    if (fallback && fallback.childNodes[0]) {
+                      fallback.removeChild(fallback.childNodes[0]);
+                    }
                   }
                 `,
               }}