diff --git a/app/assets/javascripts/app/controllers/chat.coffee b/app/assets/javascripts/app/controllers/chat.coffee
index 2357bb72d..eb5919bdf 100644
--- a/app/assets/javascripts/app/controllers/chat.coffee
+++ b/app/assets/javascripts/app/controllers/chat.coffee
@@ -601,6 +601,9 @@ class ChatWindow extends App.Controller
     @el.addClass('is-offline')
     @input.attr('disabled', true)
 
+    # add footer with create ticket button
+    @body.append App.view('customer_chat/chat_footer')()
+
   maybeAddTimestamp: ->
     timestamp = Date.now()
 
diff --git a/app/assets/javascripts/app/views/customer_chat/chat_footer.jst.eco b/app/assets/javascripts/app/views/customer_chat/chat_footer.jst.eco
new file mode 100644
index 000000000..547c4142d
--- /dev/null
+++ b/app/assets/javascripts/app/views/customer_chat/chat_footer.jst.eco
@@ -0,0 +1,3 @@
+<div class="chat-footer">
+  <div class="btn btn--primary js-createTicket">Turn chat into ticket</div>
+</div>
\ No newline at end of file
diff --git a/app/assets/stylesheets/zammad.scss b/app/assets/stylesheets/zammad.scss
index 5fa47a3c0..36af9ea5c 100644
--- a/app/assets/stylesheets/zammad.scss
+++ b/app/assets/stylesheets/zammad.scss
@@ -7275,7 +7275,6 @@ output {
   }
 
   &.is-offline {
-    .chat-body-holder,
     .chat-controls {
       opacity: 0.5;
     }
@@ -7286,7 +7285,7 @@ output {
   background: hsl(210,8%,95%);
   border: 1px solid hsl(0,0%,91%);
   border-radius: 3px 3px 0 0;
-  height: 37px;
+  height: 43px;
   line-height: 13px;
   flex-shrink: 0;
   display: flex;
@@ -7336,7 +7335,7 @@ output {
 .chat-disconnect,
 .chat-close {
   cursor: pointer;
-  padding: 0 4px;
+  padding: 10px;
   
   .btn {
     min-width: 80px;
@@ -7437,6 +7436,15 @@ output {
   67% { opacity: 1; transform: scale(1); }
 }
 
+.chat-footer {
+  border-top: 1px solid hsl(0,0%,93%);
+  padding: 10px;
+  display: flex;
+  justify-content: center;
+  align-self: stretch;
+  margin: 0 -10px;
+}
+
 .chat-controls {
   display: flex;
   align-items: flex-start;