diff --git a/components/PostCard.tsx b/components/PostCard.tsx
index a9c427e..fe94b56 100644
--- a/components/PostCard.tsx
+++ b/components/PostCard.tsx
@@ -15,32 +15,27 @@ const PostCard = ({
   readTime,
 }: PostType) => {
   const borderColor = useColorModeValue("blackAlpha.100", "whiteAlpha.200");
-  const outerBorderColor = useColorModeValue("transparent", "whiteAlpha.200");
   const date = new Date(publishedAt).toLocaleDateString("en-US", {
     day: "numeric",
     month: "long",
     year: "numeric",
   });
+  const bgHoverColor = useColorModeValue("blackAlpha.50", "whiteAlpha.200");
   return (
     <RouteLink
       borderRadius="5px"
       href={`/blog/${slug}`}
       textDecor="none!important"
       position="relative"
-      bottom="0px"
-      transition="0.2s ease all"
-      _hover={{
-        transition: "0.2s ease all",
-        bottom: "5px",
-      }}
     >
       <Box
         height="full"
         borderRadius="5px"
-        shadow="md"
         role="group"
-        borderColor={outerBorderColor}
+        borderColor={borderColor}
         borderWidth="1px"
+        transition="0.2s ease all"
+        _hover={{ bgColor: bgHoverColor, transition: "0.2s ease all" }}
       >
         <AspectRatio ratio={1.92 / 1}>
           <Box
diff --git a/components/ProjectCard.tsx b/components/ProjectCard.tsx
index 7454854..7aeb743 100644
--- a/components/ProjectCard.tsx
+++ b/components/ProjectCard.tsx
@@ -50,7 +50,7 @@ const ProjectCard = ({
       borderRadius="5px"
     >
       <AspectRatio ratio={16 / 9} w={[null, "512px"]}>
-        <Box borderLeftRadius={[0, "5px"]} borderTopRadius={["5px", 0]}>
+        <Box borderRadius={["5px 5px 0 0 ", "5px 0 0 5px"]}>
           <Image
             width="512"
             height="288"
diff --git a/components/SnippetCard.tsx b/components/SnippetCard.tsx
index 6bea28f..db88188 100644
--- a/components/SnippetCard.tsx
+++ b/components/SnippetCard.tsx
@@ -13,8 +13,14 @@ const SnippetCard = ({ logo, title, description, tags, slug }: SnippetType) => {
   const borderColor = useColorModeValue("blackAlpha.100", "whiteAlpha.200");
   const bgHoverColor = useColorModeValue("blackAlpha.50", "whiteAlpha.200");
   return (
-    <RouteLink href={`/snippet/${slug}`} textDecor="none!important" w="full">
+    <RouteLink
+      borderRadius="5px"
+      href={`/snippet/${slug}`}
+      textDecor="none!important"
+      w="full"
+    >
       <Stack
+        borderRadius="5px"
         alignItems={["flex-start", "center"]}
         direction={["column", "row"]}
         borderColor={borderColor}
diff --git a/pages/blog.tsx b/pages/blog.tsx
index 0c5205d..16700d2 100644
--- a/pages/blog.tsx
+++ b/pages/blog.tsx
@@ -22,7 +22,7 @@ const Blog = ({ posts }: BlogProps) => {
       </Heading>
       <Text>Some tech stuff and my random thoughts.</Text>
       {filteredBlogPosts.length > 0 ? (
-        <SimpleGrid columns={[1, 2]} gap="6" py="2">
+        <SimpleGrid columns={[1, 2]} gap="4" py="2">
           {filteredBlogPosts.map((post: PostType, idx: number) => (
             <PostCard {...post} key={idx} />
           ))}