diff --git a/src/app/components/confirmacion-carrito/confirmacion-carrito.component.html b/src/app/components/confirmacion-carrito/confirmacion-carrito.component.html
new file mode 100644
index 0000000..4333b74
--- /dev/null
+++ b/src/app/components/confirmacion-carrito/confirmacion-carrito.component.html
@@ -0,0 +1,48 @@
+<app-header></app-header>
+<div class="row">
+  <div class="col-10">
+
+    <!-- NOMBRE DE SECCION -->
+    <div class="row m-0">
+    <div class="col-12 p-0">
+      <p class="h5 py-1 bg-light text-muted text-center">Pago <i class="fa fa-usd"></i></p>
+    </div>
+  </div>
+
+  <div class="row m-4 d-flex align-items-center">
+    <div class="col-4">
+      <h1>Mi Compra <i class="fa fa-shopping-cart "></i></h1>
+    </div>
+    <div class="col-8">
+      <h2>¿Desea finalizar su compra?</h2>
+      <h3>Por favor, controle y confirme su compra.</h3>
+    </div>
+    <div class="col-sm-7">
+
+      <div class="row pr-3 vh-50 overflow-scroll">
+        <div
+        class="col-4 p-2"
+        *ngFor="let producto of productos">
+        <div class="card card-effect bg-white rounded-sm shadow border-0">
+          <img src="../../../assets/img/descarga.jpg" class="card-img-top w-75 m-auto">
+          <div class="card-body">
+            <p class="h5 text-left m-0">{{producto.variable}}</p>
+            <div class="text-left">
+              <p class="m-0"><small>ASDASDSADASDSA</small></p>
+              <p class="m-0"><small>COD. 1222</small></p>
+              <p class="m-0"><strong>$ 563</strong></p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="col-sm-5">
+    <h3>TOTAL: $553</h3>
+  </div>
+</div>
+
+<!-- SIDEBAR -->
+</div>
+  <app-sidebar class="col-3 col-md-2 vh-100 bg-dark text-white"></app-sidebar>
+</div>
diff --git a/src/app/components/confirmacion-carrito/confirmacion-carrito.component.scss b/src/app/components/confirmacion-carrito/confirmacion-carrito.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/components/confirmacion-carrito/confirmacion-carrito.component.spec.ts b/src/app/components/confirmacion-carrito/confirmacion-carrito.component.spec.ts
new file mode 100644
index 0000000..06954b5
--- /dev/null
+++ b/src/app/components/confirmacion-carrito/confirmacion-carrito.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ConfirmacionCarritoComponent } from './confirmacion-carrito.component';
+
+describe('ConfirmacionCarritoComponent', () => {
+  let component: ConfirmacionCarritoComponent;
+  let fixture: ComponentFixture<ConfirmacionCarritoComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ConfirmacionCarritoComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ConfirmacionCarritoComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/components/confirmacion-carrito/confirmacion-carrito.component.ts b/src/app/components/confirmacion-carrito/confirmacion-carrito.component.ts
new file mode 100644
index 0000000..3cbc05a
--- /dev/null
+++ b/src/app/components/confirmacion-carrito/confirmacion-carrito.component.ts
@@ -0,0 +1,16 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-confirmacion-carrito',
+  templateUrl: './confirmacion-carrito.component.html',
+  styleUrls: ['./confirmacion-carrito.component.scss']
+})
+export class ConfirmacionCarritoComponent implements OnInit {
+
+  productos = [{}, {}, {}]
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}