diff --git a/src/app/(routes)/blog/[slug]/_components/article-content.tsx b/src/app/(routes)/blog/[slug]/_components/article-content.tsx
index cd2e746..ff8c8e8 100644
--- a/src/app/(routes)/blog/[slug]/_components/article-content.tsx
+++ b/src/app/(routes)/blog/[slug]/_components/article-content.tsx
@@ -137,7 +137,7 @@ const nodeRenderers: RenderNode = {
     const mimeGroup = file?.contentType.split("/")[0]; // image / video etc
     switch (mimeGroup) {
       case "image":
-        return <ContentfulImage image={data} />;
+        return <ContentfulImage image={data} displayDescription />;
       // TODO: test this, make custom component if necessary
       case "video":
         return (
diff --git a/src/app/(routes)/blog/[slug]/_components/contentful-image.tsx b/src/app/(routes)/blog/[slug]/_components/contentful-image.tsx
index 9a4eef2..1c8a28a 100644
--- a/src/app/(routes)/blog/[slug]/_components/contentful-image.tsx
+++ b/src/app/(routes)/blog/[slug]/_components/contentful-image.tsx
@@ -34,7 +34,7 @@ export default function ContentfulImage({
       };
 
   return (
-    <div className="relative flex h-full w-full flex-col items-center gap-4">
+    <div className="relative flex h-full w-full flex-col items-center gap-2 pb-2">
       <Image
         src={urlWithProtocol}
         alt={description ?? "description"}
@@ -43,7 +43,9 @@ export default function ContentfulImage({
         aria-description={description}
         {...props}
       />
-      {description && displayDescription && <p>{description}</p>}
+      {description && displayDescription && (
+        <p className="font-extralight">{description}</p>
+      )}
     </div>
   );
 }