diff --git a/src/pages/sincronizar_productos_tryton.vue b/src/pages/sincronizar_productos_tryton.vue
index d0779d0..49660d9 100644
--- a/src/pages/sincronizar_productos_tryton.vue
+++ b/src/pages/sincronizar_productos_tryton.vue
@@ -1,7 +1,55 @@
 <template>
+  <v-container class="fill-height d-flex align-center justify-center">
+    <v-card class="pa-6" max-width="600" elevation="4">
+      <v-card-title class="text-h5 font-weight-bold text-center">
+        🔄 Sincronización de Productos
+      </v-card-title>
 
+      <v-card-text>
+        <p>
+          Esta acción sincronizará los <strong>productos</strong> desde el sistema
+          <strong>Tryton</strong> hacia la plataforma.
+        </p>
+        <v-alert type="warning" dense border="start" border-color="warning">
+          <strong>Advertencia:</strong> Este proceso podría tardar varios minutos
+          y reemplazar datos existentes en la plataforma.  
+          Asegúrese de que la información en Tryton esté actualizada antes de
+          continuar.
+        </v-alert>
+        <p class="mt-4">
+          Durante la sincronización, no se podrán modificar productos en la
+          plataforma para evitar conflictos.
+        </p>
+      </v-card-text>
+
+      <v-card-actions class="justify-center">
+        <v-btn color="primary" @click="startSync">
+          Iniciar Sincronización
+        </v-btn>
+        <v-btn text @click="$router.push('/')">
+          Cancelar
+        </v-btn>
+      </v-card-actions>
+    </v-card>
+    <v-data-table :items="productos_tryton"></v-data-table>
+  </v-container>
 </template>
 
 <script>
+  import { inject } from 'vue';
 
-</script>
+  export default {
+    name: 'ProductsFromTryton',
+    data() {
+      return {
+        api: inject('api'),
+        productos_tryton: [{}],
+      }
+    },
+    methods: {
+      startSync() {
+        this.productos_tryton = this.api.getProductsFromTryton()
+      }
+    }
+  }
+ </script>
diff --git a/src/services/api.js b/src/services/api.js
index f100ab3..411eef5 100644
--- a/src/services/api.js
+++ b/src/services/api.js
@@ -50,6 +50,10 @@ class Api {
   getCSVForTryton() {
     return this.apiImplementation.getCSVForTryton();
   }
+
+  getProductsFromTryton() {
+    return this.apiImplementation.getProductsFromTryton();
+  }
 }
 
 export default Api;
diff --git a/src/services/django-api.js b/src/services/django-api.js
index 7181942..d93fc4e 100644
--- a/src/services/django-api.js
+++ b/src/services/django-api.js
@@ -63,6 +63,12 @@ class DjangoApi {
     return this.getRequest(url);
   }
 
+  getProductsFromTryton(){
+    const url = this.base + '/don_confiao/api/importar_productos_de_tryton';
+    return this.postRequest(url, {});
+  }
+
+
   getRequest(url) {
     return new Promise ((resolve, reject) => {
       fetch(url)