diff --git a/assets/css/src/vanilla.css b/assets/css/src/vanilla.css
index fda30ed..4a19d8a 100644
--- a/assets/css/src/vanilla.css
+++ b/assets/css/src/vanilla.css
@@ -12,7 +12,7 @@ section:not(:last-child, .collapsable, .collapsable-sections) {
 }
 
 picture {
-  background-color: var(--color-season);
+  background-color: var(--color);
   display: flex !important;
   justify-content: center !important;
   align-items: center !important;
diff --git a/assets/js/script.js b/assets/js/script.js
index c607b9d..901daf9 100644
--- a/assets/js/script.js
+++ b/assets/js/script.js
@@ -13,6 +13,8 @@ document.addEventListener("DOMContentLoaded", () => {
     images: document.querySelectorAll("img"),
   };
 
+  console.log(nodes.images);
+
   // Listeners
   nodes.burgerBtn.addEventListener("click", () => expandNav(nodes));
   nodes.closeNavBtn.addEventListener("click", () => closeNav(nodes));
diff --git a/site/snippets/event-card.php b/site/snippets/event-card.php
index ce680c4..6a4d7b2 100644
--- a/site/snippets/event-card.php
+++ b/site/snippets/event-card.php
@@ -1,6 +1,6 @@
 <div class="event-card grid__item" style="--span: <?= $span ?>">
   <a class="event-card__link" href="<?= $event->url() ?>"></a>
-  <div class="image-wrapper">
+  <div class="image-wrapper" style="--color: <?= $event->color()->isNotEmpty() ? $event->color() : 'var(--color-season)' ?>">
   <?php if ($event->gallery()->toFiles()->count() > 1): ?>
     <?php snippet('picture', [
       'file' => $event->gallery()->toFiles()->first(), 
diff --git a/site/snippets/events-grid.php b/site/snippets/events-grid.php
index a4c6cdd..32196bd 100644
--- a/site/snippets/events-grid.php
+++ b/site/snippets/events-grid.php
@@ -14,7 +14,7 @@
               $span = 3;
             }
           }
-          snippet('event-card', ["event" => $event, "span" => $span]) 
+          snippet('event-card', ["event" => $event, "span" => $span, "color" => $event->color()->isNotEmpty() == 'true' ? $event->color() : null]) 
         ?>
     <?php endforeach ?>
   </div>
diff --git a/site/templates/event.php b/site/templates/event.php
index 8baedf8..8bb7a26 100644
--- a/site/templates/event.php
+++ b/site/templates/event.php
@@ -9,7 +9,7 @@
 </section>
 
 <section class="presentation">
-  <div id="swiper" style="--span: 8;">
+  <div id="swiper" style="--span: 8; --color: <?= $page->color()->isNotEmpty() ? $page->color() : 'var(--color-season)' ?>">
     <div class="swiper-wrapper">
       <?php foreach($page->gallery()->toFiles() as $slide): ?>
       <div class="swiper-slide">
diff --git a/site/templates/home.php b/site/templates/home.php
index 289822a..46323b8 100644
--- a/site/templates/home.php
+++ b/site/templates/home.php
@@ -6,7 +6,7 @@
         <a class="hero__link h3" href="<?= $site->heroLinkUrl()->toUrl() ?>"><?php e($site->heroLinkText()->isNotEmpty() == 'true', $site->heroLinkText(), $site->heroLinkUrl()->toUrl()) ?></a>
     <?php endif ?>
   </div>
-  <div class="hero__image">
+  <div class="hero__image" style="--color: var(--color-season)">
     <?php if ($site->heroLinkUrl()->isNotEmpty() == 'true'): ?>
       <a href="<?= $site->heroLinkUrl()->toUrl() ?>" title="en savoir plus">
         <?php snippet('picture', ['file' => $site->heroImage()->toFile()]) ?>