diff --git a/index.php b/index.php
index e6f72ad..1a45050 100644
--- a/index.php
+++ b/index.php
@@ -1,3 +1,4 @@
+<?php include "includes/card.php" ?>
 <!DOCTYPE html>
 <html lang="fr">
 
@@ -71,73 +72,13 @@
 	
 	  <div class="row">
 	  
-	  <div class="col-md-4">
-      <div class="card card-green mb-4 box-shadow">
-        <div class="card-body">
-          <h4 class="align-center">Serveur git</h4>
-          <p class="card-text">Un serveur git, permettant d'héberger les différents projets de chlore et des membres.</p>
-          <div class="align-center">
-            <div class="btn-group">
-              <a type="button" href="https://git.chlore.net" class="btn btn-green">Accéder</a>
-            </div>
-            <div>
-              <p class="powered-text">powered by <a href="https://gitea.io/en-us/">gitea</a></p>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    
-    <div class="col-md-4">
-      <div class="card card-green mb-4 box-shadow">
-        <div class="card-body">
-          <h4 class="align-center">Syndication RSS</h4>
-          <p class="card-text">Une instance de Freshrss, disponible à tout les membres et keupins.</p>
-          <div class="align-center">
-            <div class="btn-group">
-              <a type="button" href="#" class="btn btn-grey disabled">Coming Soon</a>
-            </div>
-            <div>
-              <p class="powered-text">powered by <a href="https://freshrss.org/">freshRSS</a></p>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
+	    <?php drawCard("green", "Serveur git", "Un serveur git, permettant d'héberger les différents projets de chlore et des membres.", "https://git.chlore.net", "gitea", "https://gitea.io/en-us/")  ?>
 	  
-		<div class="col-md-4">
-      <div class="card card-red mb-4 box-shadow">
-        <div class="card-body">
-          <h4 class="align-center">Quarante-douze</h4>
-          <p class="card-text">Un blog qui parle d'informatique, de culture libre et d'internet.</p>
-          <div class="align-center">
-            <div class="btn-group">
-              <a type="button" href="https://quarante-douze.net" class="btn btn-red">Accéder</a>
-            </div>
-            <div>
-            <p class="powered-text">powered by <a href="https://wordpress.org/">Wordpress</a></p>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
+	    <?php drawCard("green", "Syndication RSS", "Une instance de Freshrss, pour récupérer les dernières actualités de ses sites favoris.", "https://freshrss.chlore.net", "freshRSS", "https://freshrss.org/")  ?>
+	  
+	    <?php drawCard("red", "Quarante-Douze", "Un blog qui parle d'informatique, de culture libre et d'internet.", "https://quarante-douze.net", "Wordpress", "https://wordpress.org/")  ?>
     
-    <div class="col-md-4">
-      <div class="card card-violet mb-4 box-shadow">
-        <div class="card-body">
-          <h4 class="align-center">kazhnuz.space</h4>
-          <p class="card-text">Le blog artistique personnel de Kazhnuz.</p>
-          <div class="align-center">
-            <div class="btn-group">
-              <a type="button" href="https://kazhnuz.space" class="btn btn-violet">Accéder</a>
-            </div>
-            <div>
-              <p class="powered-text">powered by <a href="https://www.pluxml.org/">pluXML</a></p>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
+      <?php drawCard("violet", "kazhnuz.space", "Le blog creatif personnel de Kazhnuz.", "https://kazhnuz.space", "pluXML", "https://www.pluxml.org/")  ?>
     </div>
 		
 	</article>
