diff --git a/src/components/footer/Footer.astro b/src/components/footer/Footer.astro
index 66c19d3..ddb166d 100644
--- a/src/components/footer/Footer.astro
+++ b/src/components/footer/Footer.astro
@@ -2,7 +2,7 @@
 import "../../styles/fonts.css";
 ---
 
-<footer class="bg-gray-100 py-12">
+<footer class="bg-slate-200 py-12">
   <div class="grid grid-cols-12 max-w-screen-xl mx-auto gap-y-4">
     <div class="col-start-2 col-span-10 lg:col-start-2 lg:col-span-3">
       <p class="signika text-gray-900 text-lg md:text-2xl font-bold">
diff --git a/src/components/homepage/BlogPosts.astro b/src/components/homepage/BlogPosts.astro
index e334063..b52d98d 100644
--- a/src/components/homepage/BlogPosts.astro
+++ b/src/components/homepage/BlogPosts.astro
@@ -9,7 +9,7 @@ const publishedBlogPosts = await getCollection("blog", ({ data }) => {
 const maxposts = 3;
 ---
 
-<section class="pt-8 pb-16">
+<section class="pt-8 pb-16 bg-slate-100">
   <div class="max-w-screen-xl mx-6 sm:mx-12 md:mx-16 xl:mx-auto">
     <h2 class="text-left sm:text-center">
       New from our <a href="/blog" class="hyperlink">blog</a>