diff --git a/.changeset/few-olives-like.md b/.changeset/few-olives-like.md
new file mode 100644
index 0000000..ffa3ac6
--- /dev/null
+++ b/.changeset/few-olives-like.md
@@ -0,0 +1,5 @@
+---
+"notion-to-jsx": patch
+---
+
+add loading state to image skeleton component
diff --git a/packages/notion-to-jsx/src/components/Cover/index.tsx b/packages/notion-to-jsx/src/components/Cover/index.tsx
index b144245..77d3a38 100644
--- a/packages/notion-to-jsx/src/components/Cover/index.tsx
+++ b/packages/notion-to-jsx/src/components/Cover/index.tsx
@@ -17,7 +17,7 @@ const Cover = ({ src, alt }: Props) => {
   return (
     <div className={coverContainer}>
       <div className={skeletonWrapper({ isLoaded })}>
-        <Skeleton variant="image" />
+        <Skeleton variant="image" isLoading={!isLoaded} />
       </div>
       <img
         src={src}
diff --git a/packages/notion-to-jsx/src/components/Renderer/components/Image/Image.tsx b/packages/notion-to-jsx/src/components/Renderer/components/Image/Image.tsx
index 6b1c4b8..206c202 100644
--- a/packages/notion-to-jsx/src/components/Renderer/components/Image/Image.tsx
+++ b/packages/notion-to-jsx/src/components/Renderer/components/Image/Image.tsx
@@ -47,7 +47,7 @@ const Image = ({
     <div className={imageContainer}>
       <div className={imageWrapper} style={getImageStyles(format, isColumn)}>
         <div className={skeletonWrapper({ isLoaded })}>
-          <Skeleton variant="image" />
+          <Skeleton variant="image" isLoading={!isLoaded} />
         </div>
         <img
           className={imageStyle({
diff --git a/packages/notion-to-jsx/src/components/Skeleton/index.tsx b/packages/notion-to-jsx/src/components/Skeleton/index.tsx
index 76c6b8e..20a50eb 100644
--- a/packages/notion-to-jsx/src/components/Skeleton/index.tsx
+++ b/packages/notion-to-jsx/src/components/Skeleton/index.tsx
@@ -18,6 +18,10 @@ type SkeletonProps = {
    * 추가 CSS 클래스명
    */
   className?: string;
+  /**
+   * 로딩 상태
+   */
+  isLoading?: boolean;
 };
 
 /**
@@ -29,6 +33,7 @@ const Skeleton = ({
   width,
   height,
   className,
+  isLoading = true,
 }: SkeletonProps) => {
   const getVariantClass = () => {
     switch (variant) {
@@ -42,6 +47,10 @@ const Skeleton = ({
     }
   };
 
+  if (!isLoading) {
+    return null;
+  }
+
   return (
     <div
       className={`${styles.skeleton} ${getVariantClass()} ${className || ''}`}