diff --git a/docs/index.html b/docs/index.html
index 7ec36b3..b516160 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -42,7 +42,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://workchronicles.com/learn-new-things/">
                                 
-                                <img loading="lazy" src="2021-07-19T13:35:27+00:00" alt="Learn new things">
+                                <img loading="lazy" src="https://workchronicles.com/wp-content/uploads/2021/05/merch-bann.png" alt="Learn new things">
                                 
                             </a>
                         </p>
@@ -78,9 +78,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/basic-html5-template-boilerplate-code-example/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 Basic HTML5 Template: Use This HTML Boilerplate as a Starter for Any Web Dev Project 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -102,9 +100,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/excel-text-function-how-to-convert-a-number-to-text-format/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 Excel Text Function – How to Convert a Number to Text Format 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -126,9 +122,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/intro-to-advanced-actor-critic-methods-reinforcement-learning-course/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 Intro to Advanced Actor-Critic Methods: Reinforcement Learning Course 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -150,9 +144,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/what-is-a-hyperlink-definition-for-html-link-beginners/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 What is a Hyperlink? Definition for HTML Link Beginners 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -174,9 +166,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/google-docs-voice-typing-how-to-use-speech-to-text-in-a-google-doc/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 Google Docs Voice Typing – How to Use Speech-to-Text in a Google Doc 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -270,7 +260,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="http://ishadeed.com/article/button-label-alignment/">
                                 
-                                <img loading="lazy" src="http://ishadeed.com/assets/post-fb.jpg" alt="Aligning a Button Label Vertically">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -288,9 +278,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/android-camera2-api-take-photos-and-videos/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 Android Camera2 – How to Use the Camera2 API to Take Photos and Videos 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -312,9 +300,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/not-equal-sign-how-to-type-the-does-not-equal-symbol/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 Not Equal Sign – How to Type the Does Not Equal Symbol 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -354,9 +340,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/learn-how-to-deploy-12-apps-to-aws-azure-google-cloud/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 Learn How to Deploy 12 Apps to AWS, Azure, &amp;#38; Google Cloud 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -378,9 +362,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/automate-repetitive-tasks-in-excel-with-vba/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 Visual Basic Excel Tutorial – How to Automate Repetitive Tasks in a Spreadsheet 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -402,9 +384,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.freecodecamp.org/news/python-if-else-statement-conditional-statements-explained/">
                                 
-                                <img loading="lazy" src="https://www.freecodecamp.org/news/content/images/2020/09/fcc_ghost_publication_cover-3.png" alt="
-                 Python If Else Statement – Conditional Statements Explained 
-            ">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -606,7 +586,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://github.blog/2021-07-28-new-code-scanning-integrations-open-source-security-tools/">
                                 
-                                <img loading="lazy" src="https://github.blog/wp-content/uploads/2019/03/blog-card.png?fit=5001%2C2626" alt="15+ new code scanning integrations with open source security tools">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -696,7 +676,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://evilmartians.com/chronicles/introducing-anycable-javascript-and-typescript-client">
                                 
-                                <img loading="lazy" src="https://cdn.evilmartians.com/front/blocks/common/images/social-5e5bfff.png" alt="Introducing JavaScript and TypeScript client for AnyCable">
+                                <img loading="lazy" src="Martian Chronicles" alt="Introducing JavaScript and TypeScript client for AnyCable">
                                 
                             </a>
                         </p>
@@ -750,7 +730,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://github.blog/2021-07-27-github-developer-rights-fellowship-stanford-law-school/">
                                 
-                                <img loading="lazy" src="https://github.blog/wp-content/uploads/2019/03/blog-card.png?fit=5001%2C2626" alt="Standing up for developers: the GitHub Developer Rights Fellowship at Stanford Law School">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -768,7 +748,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="http://ishadeed.com/article/thinking-about-the-cut-out-effect/">
                                 
-                                <img loading="lazy" src="http://ishadeed.com/assets/post-fb.jpg" alt="Thinking About The Cut-Out Effect: CSS or SVG?">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -804,7 +784,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://www.monkeyuser.com/2021/fill-in-the-gaps/">
                                 
-                                <img loading="lazy" src="https://www.monkeyuser.com/assets/images/2021/222-fill-in-the-gaps.png" alt="Fill in the gaps">
+                                <canvas class="article__random-background"></canvas>
                                 
                             </a>
                         </p>
@@ -876,7 +856,7 @@
                         <p class="article__header-img">
                             <a target="_blank" href="https://evilmartians.com/chronicles/accessible-design-from-the-get-go">
                                 
-                                <img loading="lazy" src="https://cdn.evilmartians.com/front/blocks/common/images/social-5e5bfff.png" alt="Accessible design from the get-go">
+                                <img loading="lazy" src="Martian Chronicles" alt="Accessible design from the get-go">
                                 
                             </a>
                         </p>