diff --git a/apps/home/app/(profile-readme)/layout.tsx b/apps/home/app/(profile-readme)/layout.tsx
index 29bf28b..c74546a 100644
--- a/apps/home/app/(profile-readme)/layout.tsx
+++ b/apps/home/app/(profile-readme)/layout.tsx
@@ -1,8 +1,9 @@
 'use client'
 
-import { People } from '@/_shared'
+import { BannerBox, People } from '@/_shared'
 import '@hamsurang/ui/globals.css'
 import { postMessageToParent } from '@hamsurang/utils'
+import Image from 'next/image'
 import { usePathname, useSearchParams } from 'next/navigation'
 import { type PropsWithChildren, useEffect } from 'react'
 
@@ -34,6 +35,14 @@ export default function PeopleLayout({
       </aside>
 
       <section className="flex flex-col gap-4 flex-grow">
+        <div className="flex gap-2 mobile:flex-col">
+          <BannerBox href="https://hamsurang.notion.site/7bf061d6b6f14e80803ad00388299c81?pvs=4">
+            <Image fill src="/clean-ping.png" alt="" />
+          </BannerBox>
+          <BannerBox href="https://hamsurang.notion.site/856b66d7d9824521acfc529e8e6b2f86?pvs=4">
+            <Image fill src="/under-ping.png" alt="" />
+          </BannerBox>
+        </div>
         {readme}
         {children}
       </section>
diff --git a/apps/home/app/_shared/components/BannerBox/BannerBox.tsx b/apps/home/app/_shared/components/BannerBox/BannerBox.tsx
new file mode 100644
index 0000000..6d97b7e
--- /dev/null
+++ b/apps/home/app/_shared/components/BannerBox/BannerBox.tsx
@@ -0,0 +1,9 @@
+import type { PropsWithChildren } from 'react'
+
+export const BannerBox = ({ children, href }: PropsWithChildren<{ href: string }>) => {
+  return (
+    <a href={href} className="relative aspect-[4] flex-grow rounded-lg overflow-hidden">
+      {children}
+    </a>
+  )
+}
diff --git a/apps/home/app/_shared/components/BannerBox/index.ts b/apps/home/app/_shared/components/BannerBox/index.ts
new file mode 100644
index 0000000..cc935c1
--- /dev/null
+++ b/apps/home/app/_shared/components/BannerBox/index.ts
@@ -0,0 +1 @@
+export { BannerBox } from './BannerBox'
diff --git a/apps/home/app/_shared/components/index.ts b/apps/home/app/_shared/components/index.ts
index 65dcdac..8b2a9f0 100644
--- a/apps/home/app/_shared/components/index.ts
+++ b/apps/home/app/_shared/components/index.ts
@@ -1,6 +1,7 @@
 export * from './ActivityLog'
+export { BannerBox } from './BannerBox'
 export * from './MBTIOverview'
 export { People } from './People'
 export { Profile } from './Profile'
-export * from './Repository'
 export * from './Readme'
+export * from './Repository'
diff --git a/apps/home/public/clean-ping.png b/apps/home/public/clean-ping.png
new file mode 100644
index 0000000..5823f17
Binary files /dev/null and b/apps/home/public/clean-ping.png differ
diff --git a/apps/home/public/under-ping.png b/apps/home/public/under-ping.png
new file mode 100644
index 0000000..2ac0f33
Binary files /dev/null and b/apps/home/public/under-ping.png differ