diff --git a/source/_patterns/01-molecules/21-modal/modal.mustache b/source/_patterns/01-molecules/21-modal/modal.mustache
index ed03bfaae85346ff511e7730de0d542104e9c656..2bf1b24be7517d667e724b5a321b5d28fa6ca6d1 100644
--- a/source/_patterns/01-molecules/21-modal/modal.mustache
+++ b/source/_patterns/01-molecules/21-modal/modal.mustache
@@ -2,6 +2,7 @@
   <div class="modal__content" role="dialog">
     <div class="modal__container w-full max-w-2xl" role="dialog">
       <div class="modal__container-body elevation-10">
+        <button class="modal__close" title="Zavřít"><i class="ico--cross"></i></button>
         {{> molecules-image-card }}
       </div>
     </div>
diff --git a/source/css/molecules/modal.pcss b/source/css/molecules/modal.pcss
index 4efee0affbe8a229a259f3c245aae01945cf718f..110eee480f663a0d0f31d7646774b3130138ea84 100644
--- a/source/css/molecules/modal.pcss
+++ b/source/css/molecules/modal.pcss
@@ -35,10 +35,26 @@
   }
 
   .modal__container-body {
-    @apply bg-white;
+    @apply bg-white relative;
   }
 }
 
+.modal__close {
+  @apply
+    absolute
+    right-0
+    top-0
+    h-8
+    w-8
+    flex
+    items-center
+    justify-center
+    z-50
+    m-auto
+    text-black
+    bg-white;
+}
+
 .ReactModal__Body--open {
   @apply overflow-hidden;
 }