diff --git a/assets/images/card-image-bag.png b/assets/images/card-image-bag.png
new file mode 100644
index 0000000..0d27090
Binary files /dev/null and b/assets/images/card-image-bag.png differ
diff --git a/assets/images/card-image-coin.png b/assets/images/card-image-coin.png
new file mode 100644
index 0000000..11b00d4
Binary files /dev/null and b/assets/images/card-image-coin.png differ
diff --git a/assets/images/card-image-shopping.png b/assets/images/card-image-shopping.png
new file mode 100644
index 0000000..8cf9fb5
Binary files /dev/null and b/assets/images/card-image-shopping.png differ
diff --git a/index.html b/index.html
index ec3dbd6..4bf236c 100644
--- a/index.html
+++ b/index.html
@@ -2,36 +2,36 @@
 <html lang="pt-br">
 
 <head>
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
 
-    <meta charset="UTF-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Desafio 1 - Landing Page</title>
 
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
-    <link rel="stylesheet" href="styles/main.css">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+    <link rel="stylesheet" href="styles/main.css" />
 </head>
 
 <body>
     <!-- Header Page -->
     <header class="header-page">
         <a href="/">
-            <img class="header-page-logo" src="assets/svgs/Logo-M3Academy.svg" alt="logo da m3 academy">
+            <img class="header-page-logo" src="assets/svgs/Logo-M3Academy.svg" alt="logo da m3 academy" />
         </a>
     </header>
 
-    <!-- Banner -->
     <main>
+        <!-- Banner -->
         <div>
             <figure>
                 <!-- Versão Desktop -->
                 <img class="main-banner main-banner-desktop" src="assets/images/main-banner-image-desktop.png"
-                    alt="iamgem do banner principal">
+                    alt="iamgem do banner principal" />
                 <!-- Versão Mobile -->
                 <img class="main-banner main-banner-mobile" src="assets/images/main-banner-image-mobile.png"
-                    alt="imagem do banner principal">
+                    alt="imagem do banner principal" />
             </figure>
         </div>
 
@@ -47,9 +47,32 @@
 
             <figure class="top-infocard-image-container">
                 <img class="top-infocard-image" src="assets/images/top-infocard-image.png"
-                    alt="imagem do infocard do topo">
+                    alt="imagem do infocard do topo" />
             </figure>
         </section>
+
+        <!-- Top Card -->
+        <div class="top-cards">
+            <figure class="top-card">
+                <img class="top-card-image" src="assets/images/card-image-shopping.png"
+                    alt="imagem do primeiro card do topo" />
+                <figcaption class="top-card-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+                    Craseuismod enim non dui fringilla interdum.</figcaption>
+            </figure>
+
+            <figure class="top-card">
+                <img class="top-card-image" src="assets/images/card-image-bag.png" alt="imagem do segundo card do topo" />
+                <figcaption class="top-card-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+                    Craseuismod enim non dui fringilla interdum.</figcaption>
+            </figure>
+
+            <figure class="top-card" />
+                <img class="top-card-image" src="assets/images/card-image-coin.png"
+                    alt="imagem do terceiro card do topo">
+                <figcaption class="top-card-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+                    Craseuismod enim non dui fringilla interdum.</figcaption>
+            </figure>
+        </div>
     </main>
 </body>
 
