diff --git a/src/Components/Skeleton/skeleton.css b/src/Components/Skeleton/skeleton.css
index dfab1321..092f8dfb 100644
--- a/src/Components/Skeleton/skeleton.css
+++ b/src/Components/Skeleton/skeleton.css
@@ -58,6 +58,12 @@
   /* overflow: hidden; */
 }
 
+.skeleton-blog {
+  background: #23292f;
+  border-radius: 5%;
+  height: 100%;
+}
+
 .shimmer {
   width: 50%;
   height: 100%;
diff --git a/src/Components/Skeleton/skeletonBlog.jsx b/src/Components/Skeleton/skeletonBlog.jsx
new file mode 100644
index 00000000..4b7b36da
--- /dev/null
+++ b/src/Components/Skeleton/skeletonBlog.jsx
@@ -0,0 +1,27 @@
+import React from 'react';
+import SkeletonElement from './skeletonElement';
+import Shimmer from './shimmer';
+
+const SkeletonBlog = () => {
+    return (
+        <div className="skeleton-wrapper skeleton-blog col-lg-11 ">
+          <div style={{display: 'flex'}}>
+            <div className="article-card">
+                <SkeletonElement type="avatar"/>
+            </div>
+
+            <div className='article-content'>
+                <SkeletonElement type="title" />
+                <SkeletonElement type="text" />
+                <SkeletonElement type="text" />
+                <SkeletonElement type="text" />
+                <SkeletonElement type="text" />
+                <SkeletonElement type="text" />
+            </div>
+          </div>
+            <Shimmer/>
+        </div>
+    )
+}
+
+export default SkeletonBlog;