diff --git a/src/assets/images/blog/five-and-friends.png b/src/assets/images/blog/five-and-friends.png
new file mode 100644
index 000000000000..1b6cb43054af
Binary files /dev/null and b/src/assets/images/blog/five-and-friends.png differ
diff --git a/src/sections/Blog/Blog-sidebar/blogSidebar.style.js b/src/sections/Blog/Blog-sidebar/blogSidebar.style.js
index b936778c20ed..2aa6a69717d0 100644
--- a/src/sections/Blog/Blog-sidebar/blogSidebar.style.js
+++ b/src/sections/Blog/Blog-sidebar/blogSidebar.style.js
@@ -199,26 +199,32 @@ const BlogSideBarWrapper = styled.div`
             .card {
                 -webkit-transition: 450ms all;
                 transition: 450ms all;
-                margin: 2px 2px 2px 2px;
                 padding: 1.25rem;
+                display: flex;
+                flex-direction: column;
+                justify-content: space-around;
+                gap: 1rem;
                 background-color: ${props => props.theme.darkJungleGreenColor};   
-                border-radius: 25px;
+                border-radius: 1.5rem;
+                
                 p {
                     text-align: center;
                     letter-spacing: 0;
                     font-size: 15px;
                     font-weight: 200;
+                    margin-top: -1rem;
                     color: ${props => props.theme.white}; 
                 }
                 h2 {
                     text-align: center;
-                    font-size: 21px;
+                    font-size: 1.5rem;
                     text-transform:uppercase;
                     clear: both;
-                    margin-bottom: 0rem;
-                    margin-top: 1rem;
                     color: ${props => props.theme.white}; 
                 }
+                img {
+                    border-radius: 1rem;
+                }
                 .logo{
                  width: 100%;  
                  }
diff --git a/src/sections/Blog/Blog-sidebar/index.js b/src/sections/Blog/Blog-sidebar/index.js
index e765851824d2..33dbe6b1d1ad 100644
--- a/src/sections/Blog/Blog-sidebar/index.js
+++ b/src/sections/Blog/Blog-sidebar/index.js
@@ -9,6 +9,7 @@ import { HiOutlineChevronDown } from "@react-icons/all-files/hi/HiOutlineChevron
 // import { FaSearch } from "@react-icons/all-files/fa/FaSearch";
 
 const Discuss = "../../../assets/images/discuss/layer5-discuss-white.webp";
+const FiveandFriendsAdventures = "../../../assets/images/blog/five-and-friends.png";
 
 const Sidebar = ({ pageContext }) => {
   const data = useStaticQuery(
@@ -114,6 +115,16 @@ const Sidebar = ({ pageContext }) => {
             ))}
         </ul>
       </div>
+      <div className="explain-1">
+        <div className="cards">
+          <a href="https://layer5.io/community/adventures-of-five-and-friends">
+            <div className="card">
+              <h2>See the Adventures of Five and Friends</h2>
+              <StaticImage alt="layer5 five and friends adventures" src={FiveandFriendsAdventures} />
+            </div>
+          </a>
+        </div>
+      </div>
       <div className="subscribe">
         <form
           name="contactform"