diff --git a/pages/community/index.page.tsx b/pages/community/index.page.tsx
index dccf67ba0..96de92cc6 100644
--- a/pages/community/index.page.tsx
+++ b/pages/community/index.page.tsx
@@ -119,7 +119,7 @@ export default function communityPages(props: any) {
                       priority={index < 10}
                       loading={index < 10 ? 'eager' : 'lazy'}
                       quality={75}
-                      className='sm:w-[40px] md:w-[45px] lg:w-[50px] sm:h-[40px] md:h-[45px] lg:h-[50px] rounded-full border-black'
+                      className='sm:w-[40px] md:w-[45px] lg:w-[50px] sm:h-[40px] md:h-[45px] lg:h-[50px] rounded-full border-black transition-all duration-200 hover:scale-110 hover:ring-2 hover:ring-blue-500'
                     />
                   ))}
               </div>
diff --git a/pages/index.page.tsx b/pages/index.page.tsx
index bc627b9b5..1d1c2807f 100644
--- a/pages/index.page.tsx
+++ b/pages/index.page.tsx
@@ -374,7 +374,7 @@ const Home = (props: any) => {
             </p>
           </div>
           <div className='grid grid-cols-1 lg:grid-cols-3 gap-6 mb-12 mx-auto w-5/6 md:w-3/5 lg:w-5/6'>
-            <div className='p-4 w-full mb-6 dark:shadow-2xl'>
+            <div className='p-4 w-full mb-6 border border-slate-300 rounded-lg dark:border-none dark:shadow-2xl'>
               <Link href='https://json-schema.org/slack'>
                 <h3 className='mb-4 font-semibold flex items-center dark:text-slate-200'>
                   Join the JSON Schema Slack Workspace!
@@ -429,7 +429,7 @@ const Home = (props: any) => {
               </button>
             </div>
             {/* BlogPost Data */}
-            <div className='p-4 w-full mb-6 dark:shadow-2xl'>
+            <div className='p-4 w-full mb-6 border border-slate-300 rounded-lg dark:border-none dark:shadow-2xl'>
               <Link href={`/blog/posts/${blogPosts[0].slug}`}>
                 <h3 className='mb-5 font-semibold pt-1 dark:text-slate-200'>
                   The JSON Schema Blog
@@ -513,7 +513,7 @@ const Home = (props: any) => {
               </div>
             </div>
             <div>
-              <div className='p-4 md:w-full mb-6 mr-4 dark:shadow-2xl'>
+              <div className='p-4 w-full mb-6 border border-slate-300 rounded-lg dark:border-none dark:shadow-2xl'>
                 <h3 className='mb-2 font-semibold dark:text-slate-200'>
                   JSON Schema Community Meetings & Events
                 </h3>
diff --git a/pages/tools/index.page.tsx b/pages/tools/index.page.tsx
index 5b9bb194e..1d803eeeb 100644
--- a/pages/tools/index.page.tsx
+++ b/pages/tools/index.page.tsx
@@ -212,7 +212,7 @@ export default function ToolingPage({
             <div className='flex flex-row items-center gap-2 w-full'>
               <div className='flex items-center justify-center gap-2 w-1/2'>
                 <Link
-                  className='flex-none max-w-full'
+                  className='flex-none max-w-full hover:scale-105 transition-transform duration-200'
                   href='https://github.com/json-schema-org/website/issues/new?assignees=&labels=Status%3A+Triage&template=adding-your-tooling.yml'
                   target='_blank'
                   rel='noreferrer'
@@ -233,7 +233,7 @@ export default function ToolingPage({
 
               <div className='flex items-center justify-center gap-2 w-1/2'>
                 <Link
-                  className='flex-none max-w-full'
+                  className='flex-none max-w-full hover:scale-105 transition-transform duration-200'
                   href='https://bowtie.report'
                   target='_blank'
                   rel='noreferrer'
diff --git a/styles/globals.css b/styles/globals.css
index 58e4130c6..62e43ec3a 100644
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -302,3 +302,10 @@ border-radius: 4px; */
 .scrollbar-hidden::-webkit-scrollbar {
   display: none;
 }
+.collective-btn {
+  transition: transform 0.25s ease;
+  border-radius: 12px; /* NEW */
+}
+.collective-btn:hover {
+  transform: scale(1.06);
+}