diff --git a/gestaoRaul/balcao/templates/viewBalcao.html b/gestaoRaul/balcao/templates/viewBalcao.html
index 5d1958e..7682493 100644
--- a/gestaoRaul/balcao/templates/viewBalcao.html
+++ b/gestaoRaul/balcao/templates/viewBalcao.html
@@ -72,30 +72,32 @@
           {% for product in products %}
           {% if forloop.counter0 == 0 %}
 
-          <article 
-            name="productBox" 
-            id="productId-{{ product.id }}"
-            class="card-product"
-            onclick="addProductClick({{product.id}} , {{comanda.id}})" 
-            >
-            <p hidden id="{{forloop.counter0}}">{{product.id}}</p>
-            <p hidden id="comanda{{forloop.counter0}}">{{comanda.id}}</p>
-            {{product.name}} <br>
-            <p id="{{product.id}}"></p>
-            R$ {{product.price}}
-          </article>
+             <article 
+                   style="background-image:  url('{{product.image}}');"
+                name="productBox"
+                id="productId-{{ product.id }}" 
+                class="card-product"
+                onclick="addProductClick({{product.id}} )"
+                >
+                <p hidden id="{{forloop.counter0}}" >{{product.id}}</p>
+                <p hidden id="comanda{{forloop.counter0}}" >{{comanda.id}}</p>
+               <p class="card-product-p"> {{product.name}}</p> 
+               <p id="{{product.id}}"></p>
+               <p class="card-product-p"> R$ {{product.price}}</p>
+                </article >
 
-          {% else %}
+        {% else %}
 
-          <article 
-            name="productBox" 
-            id="productId-{{ product.id }}"
-            class="card-product"
-            onclick="addProductClick({{product.id}} , {{comanda.id}})" 
-            >
-            {{product.name}} <br>
-            R$ {{product.price}}
-          </article>
+                <article 
+                   style="background-image:  url('{{product.image}}');"
+                name="productBox"
+                id="productId-{{ product.id }}" 
+                class="card-product" 
+                onclick="addProductClick({{product.id}})"
+                >
+                  <p class="card-product-p"> {{product.name}}</p>
+                 <p class="card-product-p"> R$ {{product.price}}</p>
+                </article >
 
           {% endif %}
 
diff --git a/gestaoRaul/comandas/templates/viewcomanda.html b/gestaoRaul/comandas/templates/viewcomanda.html
index c13ab05..8d6ff2b 100644
--- a/gestaoRaul/comandas/templates/viewcomanda.html
+++ b/gestaoRaul/comandas/templates/viewcomanda.html
@@ -203,9 +203,12 @@ Detalhes {{comanda.name}}
           <input type="text" oninput="searchProduct()" id="search-product" name="search-product" placeholder="Buscar Produto" ><br>
           <div id="product-list" class="grid-list-products">
             {% for product in products %}
-                <div class="card-product" onclick="addProductComanda({{product.id}}, {{comanda.id}}, '{{product.cuisine}}')" >
-                  {{product.name}} <br>
-                  R$ {{product.price}}
+                <div 
+                style="background-image:  url('{{product.image}}');"
+                 class="card-product"
+                  onclick="addProductComanda({{product.id}}, {{comanda.id}}, '{{product.cuisine}}')" >
+                 <p class="card-product-p"> {{product.name}}</p>
+                 <p class="card-product-p"> R$ {{product.price}}</p>
                 </div >
                 {% endfor %}
               </div>
diff --git a/gestaoRaul/db.sqlite3 b/gestaoRaul/db.sqlite3
index 84aea1e..806612a 100644
Binary files a/gestaoRaul/db.sqlite3 and b/gestaoRaul/db.sqlite3 differ
diff --git a/gestaoRaul/templates/htmx_components/comandas/htmx_list_products.html b/gestaoRaul/templates/htmx_components/comandas/htmx_list_products.html
index 9245b3d..1369fa2 100644
--- a/gestaoRaul/templates/htmx_components/comandas/htmx_list_products.html
+++ b/gestaoRaul/templates/htmx_components/comandas/htmx_list_products.html
@@ -2,13 +2,13 @@
 
 {% for product in products %}
 
-<div 
-        onclick="addProductComanda({{product.id}}, {{comanda_id}}, '{{product.cuisine}}')" 
-        class="card-product"
->
-        {{product.name}} <br>
-        R$ {{product.price}}
-</div>
+        <div 
+                style="background-image:  url('{{product.image}}');"
+                 class="card-product"
+                  onclick="addProductComanda({{product.id}}, {{comanda.id}}, '{{product.cuisine}}')" >
+                 <p class="card-product-p"> {{product.name}}</p>
+                 <p class="card-product-p"> R$ {{product.price}}</p>
+                </div >
 
 {% endfor %}
 
diff --git a/gestaoRaul/templates/htmx_components/htmx_list_products_balcao.html b/gestaoRaul/templates/htmx_components/htmx_list_products_balcao.html
index 578b3ac..1239fc7 100644
--- a/gestaoRaul/templates/htmx_components/htmx_list_products_balcao.html
+++ b/gestaoRaul/templates/htmx_components/htmx_list_products_balcao.html
@@ -5,6 +5,7 @@
 {% if forloop.counter0 == 0 %}
 
                 <article 
+                   style="background-image:  url('{{product.image}}');"
                 name="productBox"
                 id="productId-{{ product.id }}" 
                 class="card-product"
@@ -12,20 +13,22 @@
                 >
                 <p hidden id="{{forloop.counter0}}" >{{product.id}}</p>
                 <p hidden id="comanda{{forloop.counter0}}" >{{comanda.id}}</p>
-                {{product.name}} <br> <p id="{{product.id}}"></p>
-                R$ {{product.price}}
+               <p class="card-product-p"> {{product.name}}</p> 
+               <p id="{{product.id}}"></p>
+               <p class="card-product-p"> R$ {{product.price}}</p>
                 </article >
 
         {% else %}
 
                 <article 
+                   style="background-image:  url('{{product.image}}');"
                 name="productBox"
                 id="productId-{{ product.id }}" 
                 class="card-product" 
                 onclick="addProductClick({{product.id}})"
                 >
-                {{product.name}} <br>
-                R$ {{product.price}}
+                  <p class="card-product-p"> {{product.name}}</p>
+                 <p class="card-product-p"> R$ {{product.price}}</p>
                 </article >
 
         {% endif %}
@@ -37,6 +40,12 @@
 
 
 
-
+        <div 
+                style="background-image:  url('{{product.image}}');"
+                 class="card-product"
+                  onclick="addProductComanda({{product.id}}, {{comanda.id}}, '{{product.cuisine}}')" >
+                 <p class="card-product-p"> {{product.name}}</p>
+                 <p class="card-product-p"> R$ {{product.price}}</p>
+                </div >
 
 
diff --git a/gestaoRaul/templates/htmx_components/products/htmx_search_products.html b/gestaoRaul/templates/htmx_components/products/htmx_search_products.html
index e31b700..8fe4717 100644
--- a/gestaoRaul/templates/htmx_components/products/htmx_search_products.html
+++ b/gestaoRaul/templates/htmx_components/products/htmx_search_products.html
@@ -16,6 +16,8 @@
 <td id="price-{{product.id}}" >R$ {{product.price}}</td>
 <td  class="hide-on-mobile" id="quantity-{{product.id}}" >{{product.quantity}}</td>
 <td  class="hide-on-mobile" id="category-{{product.id}}" >{{product.category.name}}</td>
+<td hidden class="hide-on-mobile" id="image-{{product.id}}" >{{product.image}}</td>
+
 <td>
   <div class="grid-buttons">
     <img 
diff --git a/gestaoRaul/templates/static/base.css b/gestaoRaul/templates/static/base.css
index 4f35803..cd2420b 100644
--- a/gestaoRaul/templates/static/base.css
+++ b/gestaoRaul/templates/static/base.css
@@ -146,6 +146,7 @@ input, textarea, select {
 
 
 .card-product {
+   position: relative;
   height: 130px;
   width: 150px;
   padding: 10px;
@@ -157,8 +158,28 @@ input, textarea, select {
   box-shadow: 3px 3px 10px rgba(2, 2, 2, 0.678);
   border-radius: 5px;
   transition: transform 0.4s, box-shadow 0.4s;
+    background-size: cover; 
+    background-position: center;
+    background-repeat: no-repeat; 
   }
 
+.card-product::before {
+  content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 150px;
+    height: 130px;
+     background-color: rgba(0, 0, 0, 0.737); 
+}
+
+.card-product-p {
+  position: relative;
+  z-index: 0;
+  color: #ffffff;
+  font-size: 14px;
+}
+
 .card-product:hover {
   transform: scale(1.05);
   transition: transform 0.4s, box-shadow 0.4s;