diff --git a/src/components/Snotify/snotify.html b/src/components/Snotify/snotify.html
index b82a273..c5d4f3c 100644
--- a/src/components/Snotify/snotify.html
+++ b/src/components/Snotify/snotify.html
@@ -1,7 +1,9 @@
 <div>
   <div class="snotify-backdrop" v-if="backdrop >= 0" :style="{opacity: backdrop}"></div>
   <div v-for="(position, index) in notifications" class="snotify" :class="'snotify-' + index">
-    <toast v-for="toast in notifications[index].slice(blockSize_a, blockSize_b)" :toastData="toast" :key="toast.id" @stateChanged="stateChanged">
-    </toast>
+    <slot name="toast" v-for="toast in notifications[index].slice(blockSize_a, blockSize_b)" :snotify="{stateChanged: stateChanged, toast:toast}">
+      <toast :toastData="toast" :key="toast.id" @stateChanged="stateChanged">
+      </toast>
+    </slot>
   </div>
 </div>
diff --git a/src/components/SnotifyToast/toast.html b/src/components/SnotifyToast/toast.html
index 82fb0f9..57334a9 100644
--- a/src/components/SnotifyToast/toast.html
+++ b/src/components/SnotifyToast/toast.html
@@ -10,19 +10,33 @@
             transition: toast.config.animation.time + 'ms'
           }"
   @click="onClick" @mouseenter="onMouseEnter" @mouseleave="onMouseLeave" @animationend="onExitTransitionEnd">
-  <div class="snotifyToast__progressBar" v-if="toast.config.showProgressBar && toast.config.timeout > 0">
-    <span class="snotifyToast__progressBar__percentage" :style="{'width': (state.progress * 100) + '%'}"></span>
-  </div>
-  <div class="snotifyToast__inner" v-if="!toast.config.html">
-    <div class="snotifyToast__title" v-if="toast.title">{{toast.title | truncate(toast.config.titleMaxLength)}}</div>
-    <div class="snotifyToast__body" v-if="toast.body">{{toast.body | truncate(toast.config.bodyMaxLength)}}</div>
-    <snotify-prompt v-if="toast.config.type === state.promptType" :toast="toast">
-    </snotify-prompt>
-    <div v-if="!toast.config.icon" :class="['snotify-icon', 'snotify-icon--' + toast.config.type]"></div>
-    <div v-else>
-      <img class="snotify-icon" :src='toast.config.icon'/>
+  <slot name="progressBar" v-if="toast.config.showProgressBar && toast.config.timeout > 0" :state="state">
+    <div class="snotifyToast__progressBar">
+      <span class="snotifyToast__progressBar__percentage" :style="{'width': (state.progress * 100) + '%'}"></span>
     </div>
+  </slot>
+  <div class="snotifyToast__inner" v-if="!toast.config.html">
+    <slot name="inner" :toast="toast">
+      <slot name="title" :toast="toast" v-if="toast.title">
+        <div class="snotifyToast__title">{{toast.title | truncate(toast.config.titleMaxLength)}}</div>
+      </slot>
+      <slot name="body" :toast="toast" v-if="toast.body">
+        <div class="snotifyToast__body">{{toast.body | truncate(toast.config.bodyMaxLength)}}</div>
+      </slot>
+      <slot name="prompt" :toast="toast" v-if="toast.config.type === state.promptType">
+        <snotify-prompt :toast="toast">
+        </snotify-prompt>
+      </slot>
+      <slot name="icon" :toast="toast">
+        <div v-if="!toast.config.icon" :class="['snotify-icon', 'snotify-icon--' + toast.config.type]"></div>
+        <div v-else>
+          <img class="snotify-icon" :src='toast.config.icon'/>
+        </div>
+      </slot>
+    </slot>
   </div>
   <div class="snotifyToast__inner" v-html="toast.config.html" v-else></div>
-  <snotify-button v-if="toast.config.buttons" :toast="toast"></snotify-button>
+  <slot name="buttons" :toast="toast" v-if="toast.config.buttons">
+    <snotify-button v-if="toast.config.buttons" :toast="toast"></snotify-button>
+  </slot>
 </div>