diff --git a/README.md b/README.md
index a08ea1d..33e69c1 100644
--- a/README.md
+++ b/README.md
@@ -31,6 +31,7 @@ To customize a Snackbar, pass the function a JS object with any of the following
 | container   | `DOMNode` or `string`| `document.body` | If a string is provided, the string is passed to `querySelector` to find the container|
 | width       | `string`             |                 | Any valid CSS value for `width` |
 | speed       | `string` or `number` |                 | Any valid CSS value for `transition-duration` or a duration in milliseconds |
+| icon        | `string`             |                 | `"exclamation"`, `"danger"`, `"warn"`, `"question"`, `"question-mark"`, `"info"`, `"add"`, `"plus"`, or any single character. Longer strings will be concatenated |
 
 ### Actions
 
diff --git a/dist/js-snackbar.css b/dist/js-snackbar.css
index 8cf0856..e8665b1 100644
--- a/dist/js-snackbar.css
+++ b/dist/js-snackbar.css
@@ -97,7 +97,7 @@
 
 .js-snackbar__status {
     display: none;
-    width: 15px;
+    min-width: 15px;
     margin-right: 5px;
     border-radius: 3px 0 0 3px;
     background-color: transparent;
@@ -107,7 +107,9 @@
  .js-snackbar__status.js-snackbar--warning,
  .js-snackbar__status.js-snackbar--danger,
  .js-snackbar__status.js-snackbar--info {
-    display: block;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
 
 .js-snackbar__status.js-snackbar--success  {
@@ -126,6 +128,18 @@
     background-color: #2196f3;
 }
 
+.js-snackbar__icon {
+    display: block;
+    border: 2px solid white;
+    font-weight: bold;
+    border-radius: 20px;
+    height: 20px;
+    width: 20px;
+    text-align: center;
+    margin: 0 5px;
+    font-family: monospace;
+}
+
 .js-snackbar__action {
     display: flex;
     align-items: center;
diff --git a/dist/js-snackbar.js b/dist/js-snackbar.js
index 28b6316..3d1d13a 100644
--- a/dist/js-snackbar.js
+++ b/dist/js-snackbar.js
@@ -38,7 +38,8 @@ function SnackBar(userOptions) {
       position: userOptions?.position ?? "br",
       container: userOptions?.container ?? document.body,
       width: userOptions?.width,
-      speed: userOptions?.speed
+      speed: userOptions?.speed,
+      icon: userOptions?.icon
     };
   }
 
@@ -118,42 +119,80 @@ function SnackBar(userOptions) {
     function createInnerSnackbar() {
       var innerSnack = document.createElement("div");
       innerSnack.classList.add("js-snackbar", "js-snackbar--show");
-      applyColorTo(innerSnack);
+      applyColorAndIconTo(innerSnack);
       insertMessageTo(innerSnack);
       addActionsTo(innerSnack);
       addDismissButtonTo(innerSnack);
       return innerSnack;
     }
 
-    function applyColorTo(element) {
+    function applyColorAndIconTo(element) {
       if (!_Options.status) return;
       var status = document.createElement("span");
       status.classList.add("js-snackbar__status");
+      applyColorTo(status);
+      applyIconTo(status);
+      element.appendChild(status);
 
-      switch (_Options.status) {
-        case "success":
-        case "green":
-          status.classList.add("js-snackbar--success");
-          break;
-
-        case "warning":
-        case "alert":
-        case "orange":
-          status.classList.add("js-snackbar--warning");
-          break;
+      function applyColorTo(element) {
+        switch (_Options.status) {
+          case "success":
+          case "green":
+            element.classList.add("js-snackbar--success");
+            break;
+
+          case "warning":
+          case "alert":
+          case "orange":
+            element.classList.add("js-snackbar--warning");
+            break;
+
+          case "danger":
+          case "error":
+          case "red":
+            element.classList.add("js-snackbar--danger");
+            break;
+
+          default:
+            element.classList.add("js-snackbar--info");
+            break;
+        }
+      }
 
-        case "danger":
-        case "error":
-        case "red":
-          status.classList.add("js-snackbar--danger");
-          break;
+      function applyIconTo(element) {
+        if (!_Options.icon) return;
+        var icon = document.createElement("span");
+        icon.classList.add("js-snackbar__icon");
+
+        switch (_Options.icon) {
+          case "exclamation":
+          case "warn":
+          case "danger":
+            icon.innerText = "!";
+            break;
+
+          case "info":
+          case "question":
+          case "question-mark":
+            icon.innerText = "?";
+            break;
+
+          case "plus":
+          case "add":
+            icon.innerText = "+";
+            break;
+
+          default:
+            if (_Options.icon.length > 1) {
+              console.warn("Invalid icon character provided: ", _Options.icon);
+            }
+
+            icon.innerText = _Options.icon.substr(0, 1);
+            break;
+        }
 
-        default:
-          status.classList.add("js-snackbar--info");
-          break;
+        element.appendChild(icon);
       }
-
-      element.appendChild(status);
     }
 
     function insertMessageTo(element) {
diff --git a/dist/js-snackbar.min.css b/dist/js-snackbar.min.css
index 104553c..8485914 100644
--- a/dist/js-snackbar.min.css
+++ b/dist/js-snackbar.min.css
@@ -1,2 +1,2 @@
-.js-snackbar-container{position:absolute;bottom:0;right:0;display:flex;flex-direction:column;align-items:flex-end;max-width:100%;z-index:999;overflow:hidden}.js-snackbar-container--top-left{bottom:unset;right:unset;top:0;left:0}.js-snackbar-container--top-center{top:0;bottom:unset;left:50%;right:unset;transform:translateX(-50%)}.js-snackbar-container--top-right{bottom:unset;right:0;left:unset;top:0}.js-snackbar-container--bottom-left{bottom:0;right:unset;left:0;top:unset}.js-snackbar-container--bottom-center{bottom:0;right:unset;left:50%;top:unset;transform:translateX(-50%)}.js-snackbar-container--fixed{position:fixed}.js-snackbar-container *{box-sizing:border-box}.js-snackbar__wrapper{overflow:hidden;height:auto;margin:0;border-radius:3px;display:flex;min-width:auto;transition-property:all;transition-timing-function:ease;transition-duration:.5s}.js-snackbar{display:inline-flex;box-sizing:border-box;border-radius:3px;color:#eee;font-size:16px;background-color:#262626;vertical-align:bottom;box-shadow:0 0 4px 0 #000;margin:0 10px;flex-grow:1}.js-snackbar__close,.js-snackbar__message-wrapper,.js-snackbar__status{position:relative}.js-snackbar__message-wrapper{flex:1;padding:12px}.js-snackbar__message{display:inline-block}.js-snackbar__status{display:none;width:15px;margin-right:5px;border-radius:3px 0 0 3px;background-color:transparent}.js-snackbar__status.js-snackbar--danger,.js-snackbar__status.js-snackbar--info,.js-snackbar__status.js-snackbar--success,.js-snackbar__status.js-snackbar--warning{display:block}.js-snackbar__status.js-snackbar--success{background-color:#4caf50}.js-snackbar__status.js-snackbar--warning{background-color:#ff9800}.js-snackbar__status.js-snackbar--danger{background-color:#b90909}.js-snackbar__status.js-snackbar--info{background-color:#2196f3}.js-snackbar__action{display:flex;align-items:center;padding:0 10px;color:#838cff;cursor:pointer}.js-snackbar__action:hover{background-color:#333}.js-snackbar__close{cursor:pointer;display:flex;align-items:center;padding:0 10px;user-select:none;color:#bbb}.js-snackbar__close:hover{background-color:#444}
-/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9qcy1zbmFja2Jhci5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsdUJBQ0ksaUJBQWtCLENBQ2xCLFFBQVMsQ0FDVCxPQUFRLENBQ1IsWUFBYSxDQUNiLHFCQUFzQixDQUN0QixvQkFBcUIsQ0FDckIsY0FBZSxDQUNmLFdBQVksQ0FDWixlQUNKLENBRUEsaUNBQ0ksWUFBYSxDQUNiLFdBQVksQ0FDWixLQUFNLENBQ04sTUFDSixDQUVBLG1DQUNJLEtBQU0sQ0FDTixZQUFhLENBQ2IsUUFBUyxDQUNULFdBQVksQ0FDWiwwQkFDSixDQUVBLGtDQUNJLFlBQWEsQ0FDYixPQUFRLENBQ1IsVUFBVyxDQUNYLEtBQ0osQ0FFQSxvQ0FDSSxRQUFTLENBQ1QsV0FBWSxDQUNaLE1BQU8sQ0FDUCxTQUNKLENBRUEsc0NBQ0ksUUFBUyxDQUNULFdBQVksQ0FDWixRQUFTLENBQ1QsU0FBVSxDQUNWLDBCQUNKLENBRUEsOEJBQ0ksY0FDSixDQUVBLHlCQUNJLHFCQUNKLENBRUEsc0JBQ0ksZUFBZ0IsQ0FDaEIsV0FBWSxDQUNaLFFBQVMsQ0FDVCxpQkFBa0IsQ0FDbEIsWUFBYSxDQUNiLGNBQWUsQ0FDZix1QkFBd0IsQ0FDeEIsK0JBQWdDLENBQ2hDLHVCQUNKLENBRUEsYUFDSSxtQkFBb0IsQ0FDcEIscUJBQXNCLENBQ3RCLGlCQUFrQixDQUNsQixVQUFXLENBQ1gsY0FBZSxDQUNmLHdCQUF5QixDQUN6QixxQkFBc0IsQ0FDdEIseUJBQTJCLENBQzNCLGFBQWMsQ0FDZCxXQUNKLENBRUEsdUVBR0ksaUJBQ0osQ0FFQSw4QkFDSSxNQUFPLENBQ1AsWUFDSixDQUVBLHNCQUNJLG9CQUNKLENBRUEscUJBQ0ksWUFBYSxDQUNiLFVBQVcsQ0FDWCxnQkFBaUIsQ0FDakIseUJBQTBCLENBQzFCLDRCQUNKLENBRUMsb0tBSUcsYUFDSixDQUVBLDBDQUNJLHdCQUNKLENBRUEsMENBQ0ksd0JBQ0osQ0FFQyx5Q0FDRyx3QkFDSixDQUVDLHVDQUNHLHdCQUNKLENBRUEscUJBQ0ksWUFBYSxDQUNiLGtCQUFtQixDQUNuQixjQUFlLENBQ2YsYUFBYyxDQUNkLGNBQ0osQ0FFQSwyQkFDSSxxQkFDSixDQUVBLG9CQUNJLGNBQWUsQ0FDZixZQUFhLENBQ2Isa0JBQW1CLENBQ25CLGNBQWUsQ0FDZixnQkFBaUIsQ0FDakIsVUFDSixDQUVBLDBCQUNJLHFCQUNKIiwiZmlsZSI6ImpzLXNuYWNrYmFyLm1pbi5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuanMtc25hY2tiYXItY29udGFpbmVyIHtcclxuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcclxuICAgIGJvdHRvbTogMDtcclxuICAgIHJpZ2h0OiAwO1xyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XHJcbiAgICBhbGlnbi1pdGVtczogZmxleC1lbmQ7XHJcbiAgICBtYXgtd2lkdGg6IDEwMCU7XHJcbiAgICB6LWluZGV4OiA5OTk7XHJcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xyXG59XHJcblxyXG4uanMtc25hY2tiYXItY29udGFpbmVyLS10b3AtbGVmdCB7XHJcbiAgICBib3R0b206IHVuc2V0O1xyXG4gICAgcmlnaHQ6IHVuc2V0O1xyXG4gICAgdG9wOiAwO1xyXG4gICAgbGVmdDogMDtcclxufVxyXG5cclxuLmpzLXNuYWNrYmFyLWNvbnRhaW5lci0tdG9wLWNlbnRlciB7XHJcbiAgICB0b3A6IDA7XHJcbiAgICBib3R0b206IHVuc2V0O1xyXG4gICAgbGVmdDogNTAlO1xyXG4gICAgcmlnaHQ6IHVuc2V0O1xyXG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC01MCUpO1xyXG59XHJcblxyXG4uanMtc25hY2tiYXItY29udGFpbmVyLS10b3AtcmlnaHQge1xyXG4gICAgYm90dG9tOiB1bnNldDtcclxuICAgIHJpZ2h0OiAwO1xyXG4gICAgbGVmdDogdW5zZXQ7XHJcbiAgICB0b3A6IDA7XHJcbn1cclxuXHJcbi5qcy1zbmFja2Jhci1jb250YWluZXItLWJvdHRvbS1sZWZ0IHtcclxuICAgIGJvdHRvbTogMDtcclxuICAgIHJpZ2h0OiB1bnNldDtcclxuICAgIGxlZnQ6IDA7XHJcbiAgICB0b3A6IHVuc2V0O1xyXG59XHJcblxyXG4uanMtc25hY2tiYXItY29udGFpbmVyLS1ib3R0b20tY2VudGVyIHtcclxuICAgIGJvdHRvbTogMDtcclxuICAgIHJpZ2h0OiB1bnNldDtcclxuICAgIGxlZnQ6IDUwJTtcclxuICAgIHRvcDogdW5zZXQ7XHJcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoLTUwJSk7XHJcbn1cclxuXHJcbi5qcy1zbmFja2Jhci1jb250YWluZXItLWZpeGVkIHtcclxuICAgIHBvc2l0aW9uOiBmaXhlZDtcclxufVxyXG5cclxuLmpzLXNuYWNrYmFyLWNvbnRhaW5lciAqIHtcclxuICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XHJcbn1cclxuXHJcbi5qcy1zbmFja2Jhcl9fd3JhcHBlciB7XHJcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xyXG4gICAgaGVpZ2h0OiBhdXRvO1xyXG4gICAgbWFyZ2luOiAwO1xyXG4gICAgYm9yZGVyLXJhZGl1czogM3B4O1xyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIG1pbi13aWR0aDogYXV0bztcclxuICAgIHRyYW5zaXRpb24tcHJvcGVydHk6IGFsbDtcclxuICAgIHRyYW5zaXRpb24tdGltaW5nLWZ1bmN0aW9uOiBlYXNlO1xyXG4gICAgdHJhbnNpdGlvbi1kdXJhdGlvbjogMC41cztcclxufVxyXG5cclxuLmpzLXNuYWNrYmFyIHtcclxuICAgIGRpc3BsYXk6IGlubGluZS1mbGV4O1xyXG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcclxuICAgIGJvcmRlci1yYWRpdXM6IDNweDtcclxuICAgIGNvbG9yOiAjZWVlO1xyXG4gICAgZm9udC1zaXplOiAxNnB4O1xyXG4gICAgYmFja2dyb3VuZC1jb2xvcjogIzI2MjYyNjtcclxuICAgIHZlcnRpY2FsLWFsaWduOiBib3R0b207XHJcbiAgICBib3gtc2hhZG93OiAwIDAgNHB4IDAgYmxhY2s7XHJcbiAgICBtYXJnaW46IDAgMTBweDtcclxuICAgIGZsZXgtZ3JvdzogMTtcclxufVxyXG5cclxuLmpzLXNuYWNrYmFyX19jbG9zZSxcclxuLmpzLXNuYWNrYmFyX19zdGF0dXMsXHJcbi5qcy1zbmFja2Jhcl9fbWVzc2FnZS13cmFwcGVyIHtcclxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcclxufVxyXG5cclxuLmpzLXNuYWNrYmFyX19tZXNzYWdlLXdyYXBwZXIge1xyXG4gICAgZmxleDogMTtcclxuICAgIHBhZGRpbmc6IDEycHg7XHJcbn1cclxuXHJcbi5qcy1zbmFja2Jhcl9fbWVzc2FnZSB7XHJcbiAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XHJcbn1cclxuXHJcbi5qcy1zbmFja2Jhcl9fc3RhdHVzIHtcclxuICAgIGRpc3BsYXk6IG5vbmU7XHJcbiAgICB3aWR0aDogMTVweDtcclxuICAgIG1hcmdpbi1yaWdodDogNXB4O1xyXG4gICAgYm9yZGVyLXJhZGl1czogM3B4IDAgMCAzcHg7XHJcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcclxufVxyXG5cclxuIC5qcy1zbmFja2Jhcl9fc3RhdHVzLmpzLXNuYWNrYmFyLS1zdWNjZXNzLFxyXG4gLmpzLXNuYWNrYmFyX19zdGF0dXMuanMtc25hY2tiYXItLXdhcm5pbmcsXHJcbiAuanMtc25hY2tiYXJfX3N0YXR1cy5qcy1zbmFja2Jhci0tZGFuZ2VyLFxyXG4gLmpzLXNuYWNrYmFyX19zdGF0dXMuanMtc25hY2tiYXItLWluZm8ge1xyXG4gICAgZGlzcGxheTogYmxvY2s7XHJcbn1cclxuXHJcbi5qcy1zbmFja2Jhcl9fc3RhdHVzLmpzLXNuYWNrYmFyLS1zdWNjZXNzICB7XHJcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjNGNhZjUwO1xyXG59XHJcblxyXG4uanMtc25hY2tiYXJfX3N0YXR1cy5qcy1zbmFja2Jhci0td2FybmluZyAge1xyXG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2ZmOTgwMDtcclxufVxyXG5cclxuIC5qcy1zbmFja2Jhcl9fc3RhdHVzLmpzLXNuYWNrYmFyLS1kYW5nZXIge1xyXG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2I5MDkwOTtcclxufVxyXG5cclxuIC5qcy1zbmFja2Jhcl9fc3RhdHVzLmpzLXNuYWNrYmFyLS1pbmZvIHtcclxuICAgIGJhY2tncm91bmQtY29sb3I6ICMyMTk2ZjM7XHJcbn1cclxuXHJcbi5qcy1zbmFja2Jhcl9fYWN0aW9uIHtcclxuICAgIGRpc3BsYXk6IGZsZXg7XHJcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gICAgcGFkZGluZzogMCAxMHB4O1xyXG4gICAgY29sb3I6ICM4MzhjZmY7XHJcbiAgICBjdXJzb3I6IHBvaW50ZXI7XHJcbn1cclxuXHJcbi5qcy1zbmFja2Jhcl9fYWN0aW9uOmhvdmVyIHtcclxuICAgIGJhY2tncm91bmQtY29sb3I6ICMzMzM7XHJcbn1cclxuXHJcbi5qcy1zbmFja2Jhcl9fY2xvc2Uge1xyXG4gICAgY3Vyc29yOiBwb2ludGVyO1xyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XHJcbiAgICBwYWRkaW5nOiAwIDEwcHg7XHJcbiAgICB1c2VyLXNlbGVjdDogbm9uZTtcclxuICAgIGNvbG9yOiAjQkJCO1xyXG59XHJcblxyXG4uanMtc25hY2tiYXJfX2Nsb3NlOmhvdmVyIHtcclxuICAgIGJhY2tncm91bmQtY29sb3I6ICM0NDQ7XHJcbn0iXX0= */
\ No newline at end of file
+.js-snackbar-container{position:absolute;bottom:0;right:0;display:flex;flex-direction:column;align-items:flex-end;max-width:100%;z-index:999;overflow:hidden}.js-snackbar-container--top-left{bottom:unset;right:unset;top:0;left:0}.js-snackbar-container--top-center{top:0;bottom:unset;left:50%;right:unset;transform:translateX(-50%)}.js-snackbar-container--top-right{bottom:unset;right:0;left:unset;top:0}.js-snackbar-container--bottom-left{bottom:0;right:unset;left:0;top:unset}.js-snackbar-container--bottom-center{bottom:0;right:unset;left:50%;top:unset;transform:translateX(-50%)}.js-snackbar-container--fixed{position:fixed}.js-snackbar-container *{box-sizing:border-box}.js-snackbar__wrapper{overflow:hidden;height:auto;margin:0;border-radius:3px;display:flex;min-width:auto;transition-property:all;transition-timing-function:ease;transition-duration:.5s}.js-snackbar{display:inline-flex;box-sizing:border-box;border-radius:3px;color:#eee;font-size:16px;background-color:#262626;vertical-align:bottom;box-shadow:0 0 4px 0 #000;margin:0 10px;flex-grow:1}.js-snackbar__close,.js-snackbar__message-wrapper,.js-snackbar__status{position:relative}.js-snackbar__message-wrapper{flex:1;padding:12px}.js-snackbar__message{display:inline-block}.js-snackbar__status{display:none;min-width:15px;margin-right:5px;border-radius:3px 0 0 3px;background-color:transparent}.js-snackbar__status.js-snackbar--danger,.js-snackbar__status.js-snackbar--info,.js-snackbar__status.js-snackbar--success,.js-snackbar__status.js-snackbar--warning{display:flex;justify-content:center;align-items:center}.js-snackbar__status.js-snackbar--success{background-color:#4caf50}.js-snackbar__status.js-snackbar--warning{background-color:#ff9800}.js-snackbar__status.js-snackbar--danger{background-color:#b90909}.js-snackbar__status.js-snackbar--info{background-color:#2196f3}.js-snackbar__icon{display:block;border:2px solid #fff;font-weight:700;border-radius:20px;height:20px;width:20px;text-align:center;margin:0 5px;font-family:monospace}.js-snackbar__action{display:flex;align-items:center;padding:0 10px;color:#838cff;cursor:pointer}.js-snackbar__action:hover{background-color:#333}.js-snackbar__close{cursor:pointer;display:flex;align-items:center;padding:0 10px;user-select:none;color:#bbb}.js-snackbar__close:hover{background-color:#444}
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9qcy1zbmFja2Jhci5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsdUJBQ0ksaUJBQWtCLENBQ2xCLFFBQVMsQ0FDVCxPQUFRLENBQ1IsWUFBYSxDQUNiLHFCQUFzQixDQUN0QixvQkFBcUIsQ0FDckIsY0FBZSxDQUNmLFdBQVksQ0FDWixlQUNKLENBRUEsaUNBQ0ksWUFBYSxDQUNiLFdBQVksQ0FDWixLQUFNLENBQ04sTUFDSixDQUVBLG1DQUNJLEtBQU0sQ0FDTixZQUFhLENBQ2IsUUFBUyxDQUNULFdBQVksQ0FDWiwwQkFDSixDQUVBLGtDQUNJLFlBQWEsQ0FDYixPQUFRLENBQ1IsVUFBVyxDQUNYLEtBQ0osQ0FFQSxvQ0FDSSxRQUFTLENBQ1QsV0FBWSxDQUNaLE1BQU8sQ0FDUCxTQUNKLENBRUEsc0NBQ0ksUUFBUyxDQUNULFdBQVksQ0FDWixRQUFTLENBQ1QsU0FBVSxDQUNWLDBCQUNKLENBRUEsOEJBQ0ksY0FDSixDQUVBLHlCQUNJLHFCQUNKLENBRUEsc0JBQ0ksZUFBZ0IsQ0FDaEIsV0FBWSxDQUNaLFFBQVMsQ0FDVCxpQkFBa0IsQ0FDbEIsWUFBYSxDQUNiLGNBQWUsQ0FDZix1QkFBd0IsQ0FDeEIsK0JBQWdDLENBQ2hDLHVCQUNKLENBRUEsYUFDSSxtQkFBb0IsQ0FDcEIscUJBQXNCLENBQ3RCLGlCQUFrQixDQUNsQixVQUFXLENBQ1gsY0FBZSxDQUNmLHdCQUF5QixDQUN6QixxQkFBc0IsQ0FDdEIseUJBQTJCLENBQzNCLGFBQWMsQ0FDZCxXQUNKLENBRUEsdUVBR0ksaUJBQ0osQ0FFQSw4QkFDSSxNQUFPLENBQ1AsWUFDSixDQUVBLHNCQUNJLG9CQUNKLENBRUEscUJBQ0ksWUFBYSxDQUNiLGNBQWUsQ0FDZixnQkFBaUIsQ0FDakIseUJBQTBCLENBQzFCLDRCQUNKLENBRUMsb0tBSUcsWUFBYSxDQUNiLHNCQUF1QixDQUN2QixrQkFDSixDQUVBLDBDQUNJLHdCQUNKLENBRUEsMENBQ0ksd0JBQ0osQ0FFQyx5Q0FDRyx3QkFDSixDQUVDLHVDQUNHLHdCQUNKLENBRUEsbUJBQ0ksYUFBYyxDQUNkLHFCQUF1QixDQUN2QixlQUFpQixDQUNqQixrQkFBbUIsQ0FDbkIsV0FBWSxDQUNaLFVBQVcsQ0FDWCxpQkFBa0IsQ0FDbEIsWUFBYSxDQUNiLHFCQUNKLENBRUEscUJBQ0ksWUFBYSxDQUNiLGtCQUFtQixDQUNuQixjQUFlLENBQ2YsYUFBYyxDQUNkLGNBQ0osQ0FFQSwyQkFDSSxxQkFDSixDQUVBLG9CQUNJLGNBQWUsQ0FDZixZQUFhLENBQ2Isa0JBQW1CLENBQ25CLGNBQWUsQ0FDZixnQkFBaUIsQ0FDakIsVUFDSixDQUVBLDBCQUNJLHFCQUNKIiwiZmlsZSI6ImpzLXNuYWNrYmFyLm1pbi5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuanMtc25hY2tiYXItY29udGFpbmVyIHtcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgYm90dG9tOiAwO1xuICAgIHJpZ2h0OiAwO1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBhbGlnbi1pdGVtczogZmxleC1lbmQ7XG4gICAgbWF4LXdpZHRoOiAxMDAlO1xuICAgIHotaW5kZXg6IDk5OTtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xufVxuXG4uanMtc25hY2tiYXItY29udGFpbmVyLS10b3AtbGVmdCB7XG4gICAgYm90dG9tOiB1bnNldDtcbiAgICByaWdodDogdW5zZXQ7XG4gICAgdG9wOiAwO1xuICAgIGxlZnQ6IDA7XG59XG5cbi5qcy1zbmFja2Jhci1jb250YWluZXItLXRvcC1jZW50ZXIge1xuICAgIHRvcDogMDtcbiAgICBib3R0b206IHVuc2V0O1xuICAgIGxlZnQ6IDUwJTtcbiAgICByaWdodDogdW5zZXQ7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC01MCUpO1xufVxuXG4uanMtc25hY2tiYXItY29udGFpbmVyLS10b3AtcmlnaHQge1xuICAgIGJvdHRvbTogdW5zZXQ7XG4gICAgcmlnaHQ6IDA7XG4gICAgbGVmdDogdW5zZXQ7XG4gICAgdG9wOiAwO1xufVxuXG4uanMtc25hY2tiYXItY29udGFpbmVyLS1ib3R0b20tbGVmdCB7XG4gICAgYm90dG9tOiAwO1xuICAgIHJpZ2h0OiB1bnNldDtcbiAgICBsZWZ0OiAwO1xuICAgIHRvcDogdW5zZXQ7XG59XG5cbi5qcy1zbmFja2Jhci1jb250YWluZXItLWJvdHRvbS1jZW50ZXIge1xuICAgIGJvdHRvbTogMDtcbiAgICByaWdodDogdW5zZXQ7XG4gICAgbGVmdDogNTAlO1xuICAgIHRvcDogdW5zZXQ7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC01MCUpO1xufVxuXG4uanMtc25hY2tiYXItY29udGFpbmVyLS1maXhlZCB7XG4gICAgcG9zaXRpb246IGZpeGVkO1xufVxuXG4uanMtc25hY2tiYXItY29udGFpbmVyICoge1xuICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG59XG5cbi5qcy1zbmFja2Jhcl9fd3JhcHBlciB7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICBoZWlnaHQ6IGF1dG87XG4gICAgbWFyZ2luOiAwO1xuICAgIGJvcmRlci1yYWRpdXM6IDNweDtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIG1pbi13aWR0aDogYXV0bztcbiAgICB0cmFuc2l0aW9uLXByb3BlcnR5OiBhbGw7XG4gICAgdHJhbnNpdGlvbi10aW1pbmctZnVuY3Rpb246IGVhc2U7XG4gICAgdHJhbnNpdGlvbi1kdXJhdGlvbjogMC41cztcbn1cblxuLmpzLXNuYWNrYmFyIHtcbiAgICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgIGJvcmRlci1yYWRpdXM6IDNweDtcbiAgICBjb2xvcjogI2VlZTtcbiAgICBmb250LXNpemU6IDE2cHg7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogIzI2MjYyNjtcbiAgICB2ZXJ0aWNhbC1hbGlnbjogYm90dG9tO1xuICAgIGJveC1zaGFkb3c6IDAgMCA0cHggMCBibGFjaztcbiAgICBtYXJnaW46IDAgMTBweDtcbiAgICBmbGV4LWdyb3c6IDE7XG59XG5cbi5qcy1zbmFja2Jhcl9fY2xvc2UsXG4uanMtc25hY2tiYXJfX3N0YXR1cyxcbi5qcy1zbmFja2Jhcl9fbWVzc2FnZS13cmFwcGVyIHtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbi5qcy1zbmFja2Jhcl9fbWVzc2FnZS13cmFwcGVyIHtcbiAgICBmbGV4OiAxO1xuICAgIHBhZGRpbmc6IDEycHg7XG59XG5cbi5qcy1zbmFja2Jhcl9fbWVzc2FnZSB7XG4gICAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xufVxuXG4uanMtc25hY2tiYXJfX3N0YXR1cyB7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgICBtaW4td2lkdGg6IDE1cHg7XG4gICAgbWFyZ2luLXJpZ2h0OiA1cHg7XG4gICAgYm9yZGVyLXJhZGl1czogM3B4IDAgMCAzcHg7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG59XG5cbiAuanMtc25hY2tiYXJfX3N0YXR1cy5qcy1zbmFja2Jhci0tc3VjY2VzcyxcbiAuanMtc25hY2tiYXJfX3N0YXR1cy5qcy1zbmFja2Jhci0td2FybmluZyxcbiAuanMtc25hY2tiYXJfX3N0YXR1cy5qcy1zbmFja2Jhci0tZGFuZ2VyLFxuIC5qcy1zbmFja2Jhcl9fc3RhdHVzLmpzLXNuYWNrYmFyLS1pbmZvIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG59XG5cbi5qcy1zbmFja2Jhcl9fc3RhdHVzLmpzLXNuYWNrYmFyLS1zdWNjZXNzICB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogIzRjYWY1MDtcbn1cblxuLmpzLXNuYWNrYmFyX19zdGF0dXMuanMtc25hY2tiYXItLXdhcm5pbmcgIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmY5ODAwO1xufVxuXG4gLmpzLXNuYWNrYmFyX19zdGF0dXMuanMtc25hY2tiYXItLWRhbmdlciB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2I5MDkwOTtcbn1cblxuIC5qcy1zbmFja2Jhcl9fc3RhdHVzLmpzLXNuYWNrYmFyLS1pbmZvIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjMjE5NmYzO1xufVxuXG4uanMtc25hY2tiYXJfX2ljb24ge1xuICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgIGJvcmRlcjogMnB4IHNvbGlkIHdoaXRlO1xuICAgIGZvbnQtd2VpZ2h0OiBib2xkO1xuICAgIGJvcmRlci1yYWRpdXM6IDIwcHg7XG4gICAgaGVpZ2h0OiAyMHB4O1xuICAgIHdpZHRoOiAyMHB4O1xuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgICBtYXJnaW46IDAgNXB4O1xuICAgIGZvbnQtZmFtaWx5OiBtb25vc3BhY2U7XG59XG5cbi5qcy1zbmFja2Jhcl9fYWN0aW9uIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgcGFkZGluZzogMCAxMHB4O1xuICAgIGNvbG9yOiAjODM4Y2ZmO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbn1cblxuLmpzLXNuYWNrYmFyX19hY3Rpb246aG92ZXIge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICMzMzM7XG59XG5cbi5qcy1zbmFja2Jhcl9fY2xvc2Uge1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgcGFkZGluZzogMCAxMHB4O1xuICAgIHVzZXItc2VsZWN0OiBub25lO1xuICAgIGNvbG9yOiAjQkJCO1xufVxuXG4uanMtc25hY2tiYXJfX2Nsb3NlOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjNDQ0O1xufSJdfQ== */
\ No newline at end of file
diff --git a/dist/js-snackbar.min.js b/dist/js-snackbar.min.js
index 0dac64b..a62c6c6 100644
--- a/dist/js-snackbar.min.js
+++ b/dist/js-snackbar.min.js
@@ -1,4 +1,4 @@
-function SnackBar(userOptions){var _This=this;var _Interval;var _Element;var _Container;var _Message;var _MessageWrapper;function _create(){_applyUserOptions();_setContainer();_applyPositionClasses();_Element=_createMessage();_Container.appendChild(_Element);if(_Options.timeout!==false&&_Options.timeout>0){_Interval=setTimeout(_This.Close,_Options.timeout)}}function _applyUserOptions(){_Options={message:userOptions?.message??"Operation performed successfully.",dismissible:userOptions?.dismissible??true,timeout:userOptions?.timeout??5000,status:userOptions?.status?userOptions.status.toLowerCase().trim():"",actions:userOptions?.actions??[],fixed:userOptions?.fixed??false,position:userOptions?.position??"br",container:userOptions?.container??document.body,width:userOptions?.width,speed:userOptions?.speed}}function _setContainer(){var target=getOrFindContainer();if(target===undefined){console.warn("SnackBar: Could not find target container "+_Options.container);target=document.body;// default to the body as the container
-}_Container=getOrAddContainerIn(target);function getOrAddContainerIn(target){var node;var positionClass=_getPositionClass();for(var i=0;i<target.children.length;i++){node=target.children.item(i);if(node.nodeType===1&&node.classList.length>0&&node.classList.contains("js-snackbar-container")&&node.classList.contains(positionClass)){return node}}return createNewContainer(target)}function createNewContainer(target){container=document.createElement("div");container.classList.add("js-snackbar-container");if(_Options.fixed){container.classList.add("js-snackbar-container--fixed")}target.appendChild(container);return container}function getOrFindContainer(){return typeof _Options.container==="object"?_Options.container:document.getElementById(_Options.container)}}function _applyPositionClasses(){_Container.classList.add(_getPositionClass());var fixedClassName="js-snackbar-container--fixed";if(_Options.fixed){_Container.classList.add(fixedClassName)}else{_Container.classList.remove(fixedClassName)}}function _createMessage(){var outerElement=createWrapper();var innerSnack=createInnerSnackbar();outerElement.appendChild(innerSnack);return outerElement;function createWrapper(){var outerElement=document.createElement("div");outerElement.classList.add("js-snackbar__wrapper");outerElement.style.height="0px";outerElement.style.opacity="0";outerElement.style.marginTop="0px";outerElement.style.marginBottom="0px";setWidth(outerElement);setSpeed(outerElement);return outerElement}function createInnerSnackbar(){var innerSnack=document.createElement("div");innerSnack.classList.add("js-snackbar","js-snackbar--show");applyColorTo(innerSnack);insertMessageTo(innerSnack);addActionsTo(innerSnack);addDismissButtonTo(innerSnack);return innerSnack}function applyColorTo(element){if(!_Options.status)return;var status=document.createElement("span");status.classList.add("js-snackbar__status");switch(_Options.status){case"success":case"green":status.classList.add("js-snackbar--success");break;case"warning":case"alert":case"orange":status.classList.add("js-snackbar--warning");break;case"danger":case"error":case"red":status.classList.add("js-snackbar--danger");break;default:status.classList.add("js-snackbar--info");break;}element.appendChild(status)}function insertMessageTo(element){_MessageWrapper=document.createElement("div");_MessageWrapper.classList.add("js-snackbar__message-wrapper");_Message=document.createElement("span");_Message.classList.add("js-snackbar__message");_Message.innerHTML=_Options.message;_MessageWrapper.appendChild(_Message);element.appendChild(_MessageWrapper)}function addActionsTo(element){if(typeof _Options.actions!=="object"){return}for(var i=0;i<_Options.actions.length;i++){addAction(element,_Options.actions[i])}function addAction(element,action){var button=document.createElement("span");button.classList.add("js-snackbar__action");button.textContent=action.text;if(typeof action.function==="function"){if(action.dismiss===true){button.onclick=function(){action.function();_This.Close()}}else{button.onclick=action.function}}else{button.onclick=_This.Close}element.appendChild(button)}}function addDismissButtonTo(element){if(!_Options.dismissible){return}var closeButton=document.createElement("span");closeButton.classList.add("js-snackbar__close");closeButton.innerText="\xD7";closeButton.onclick=_This.Close;element.appendChild(closeButton)}function setWidth(element){if(!_Options.width)return;element.style.width=_Options.width}function setSpeed(element){const{speed}=_Options;switch(typeof speed){case"number":element.style.transitionDuration=speed+"ms";break;case"string":element.style.transitionDuration=speed;break;}}}function _getPositionClass(){switch(_Options.position){case"bl":return"js-snackbar-container--bottom-left";case"tl":return"js-snackbar-container--top-left";case"tr":return"js-snackbar-container--top-right";case"tc":case"tm":return"js-snackbar-container--top-center";case"bc":case"bm":return"js-snackbar-container--bottom-center";default:return"js-snackbar-container--bottom-right";}}this.Open=function(){var contentHeight=getMessageHeight();_Element.style.height=contentHeight+"px";_Element.style.opacity=1;_Element.style.marginTop="5px";_Element.style.marginBottom="5px";_Element.addEventListener("transitioned",function(){_Element.removeEventListener("transitioned",arguments.callee);_Element.style.height=null});function getMessageHeight(){const wrapperStyles=window.getComputedStyle(_MessageWrapper);return _Message.scrollHeight+parseFloat(wrapperStyles.getPropertyValue("padding-top"))+parseFloat(wrapperStyles.getPropertyValue("padding-bottom"))}};this.Close=function(){if(_Interval)clearInterval(_Interval);var snackbarHeight=_Element.scrollHeight;// get the auto height as a px value
+function SnackBar(userOptions){var _This=this;var _Interval;var _Element;var _Container;var _Message;var _MessageWrapper;function _create(){_applyUserOptions();_setContainer();_applyPositionClasses();_Element=_createMessage();_Container.appendChild(_Element);if(_Options.timeout!==false&&_Options.timeout>0){_Interval=setTimeout(_This.Close,_Options.timeout)}}function _applyUserOptions(){_Options={message:userOptions?.message??"Operation performed successfully.",dismissible:userOptions?.dismissible??true,timeout:userOptions?.timeout??5000,status:userOptions?.status?userOptions.status.toLowerCase().trim():"",actions:userOptions?.actions??[],fixed:userOptions?.fixed??false,position:userOptions?.position??"br",container:userOptions?.container??document.body,width:userOptions?.width,speed:userOptions?.speed,icon:userOptions?.icon}}function _setContainer(){var target=getOrFindContainer();if(target===undefined){console.warn("SnackBar: Could not find target container "+_Options.container);target=document.body;// default to the body as the container
+}_Container=getOrAddContainerIn(target);function getOrAddContainerIn(target){var node;var positionClass=_getPositionClass();for(var i=0;i<target.children.length;i++){node=target.children.item(i);if(node.nodeType===1&&node.classList.length>0&&node.classList.contains("js-snackbar-container")&&node.classList.contains(positionClass)){return node}}return createNewContainer(target)}function createNewContainer(target){container=document.createElement("div");container.classList.add("js-snackbar-container");if(_Options.fixed){container.classList.add("js-snackbar-container--fixed")}target.appendChild(container);return container}function getOrFindContainer(){return typeof _Options.container==="object"?_Options.container:document.getElementById(_Options.container)}}function _applyPositionClasses(){_Container.classList.add(_getPositionClass());var fixedClassName="js-snackbar-container--fixed";if(_Options.fixed){_Container.classList.add(fixedClassName)}else{_Container.classList.remove(fixedClassName)}}function _createMessage(){var outerElement=createWrapper();var innerSnack=createInnerSnackbar();outerElement.appendChild(innerSnack);return outerElement;function createWrapper(){var outerElement=document.createElement("div");outerElement.classList.add("js-snackbar__wrapper");outerElement.style.height="0px";outerElement.style.opacity="0";outerElement.style.marginTop="0px";outerElement.style.marginBottom="0px";setWidth(outerElement);setSpeed(outerElement);return outerElement}function createInnerSnackbar(){var innerSnack=document.createElement("div");innerSnack.classList.add("js-snackbar","js-snackbar--show");applyColorAndIconTo(innerSnack);insertMessageTo(innerSnack);addActionsTo(innerSnack);addDismissButtonTo(innerSnack);return innerSnack}function applyColorAndIconTo(element){if(!_Options.status)return;var status=document.createElement("span");status.classList.add("js-snackbar__status");applyColorTo(status);applyIconTo(status);element.appendChild(status);function applyColorTo(element){switch(_Options.status){case"success":case"green":element.classList.add("js-snackbar--success");break;case"warning":case"alert":case"orange":element.classList.add("js-snackbar--warning");break;case"danger":case"error":case"red":element.classList.add("js-snackbar--danger");break;default:element.classList.add("js-snackbar--info");break;}}function applyIconTo(element){if(!_Options.icon)return;var icon=document.createElement("span");icon.classList.add("js-snackbar__icon");switch(_Options.icon){case"exclamation":case"warn":case"danger":icon.innerText="!";break;case"info":case"question":case"question-mark":icon.innerText="?";break;case"plus":case"add":icon.innerText="+";break;default:if(_Options.icon.length>1){console.warn("Invalid icon character provided: ",_Options.icon)}icon.innerText=_Options.icon.substr(0,1);break;}element.appendChild(icon)}}function insertMessageTo(element){_MessageWrapper=document.createElement("div");_MessageWrapper.classList.add("js-snackbar__message-wrapper");_Message=document.createElement("span");_Message.classList.add("js-snackbar__message");_Message.innerHTML=_Options.message;_MessageWrapper.appendChild(_Message);element.appendChild(_MessageWrapper)}function addActionsTo(element){if(typeof _Options.actions!=="object"){return}for(var i=0;i<_Options.actions.length;i++){addAction(element,_Options.actions[i])}function addAction(element,action){var button=document.createElement("span");button.classList.add("js-snackbar__action");button.textContent=action.text;if(typeof action.function==="function"){if(action.dismiss===true){button.onclick=function(){action.function();_This.Close()}}else{button.onclick=action.function}}else{button.onclick=_This.Close}element.appendChild(button)}}function addDismissButtonTo(element){if(!_Options.dismissible){return}var closeButton=document.createElement("span");closeButton.classList.add("js-snackbar__close");closeButton.innerText="\xD7";closeButton.onclick=_This.Close;element.appendChild(closeButton)}function setWidth(element){if(!_Options.width)return;element.style.width=_Options.width}function setSpeed(element){const{speed}=_Options;switch(typeof speed){case"number":element.style.transitionDuration=speed+"ms";break;case"string":element.style.transitionDuration=speed;break;}}}function _getPositionClass(){switch(_Options.position){case"bl":return"js-snackbar-container--bottom-left";case"tl":return"js-snackbar-container--top-left";case"tr":return"js-snackbar-container--top-right";case"tc":case"tm":return"js-snackbar-container--top-center";case"bc":case"bm":return"js-snackbar-container--bottom-center";default:return"js-snackbar-container--bottom-right";}}this.Open=function(){var contentHeight=getMessageHeight();_Element.style.height=contentHeight+"px";_Element.style.opacity=1;_Element.style.marginTop="5px";_Element.style.marginBottom="5px";_Element.addEventListener("transitioned",function(){_Element.removeEventListener("transitioned",arguments.callee);_Element.style.height=null});function getMessageHeight(){const wrapperStyles=window.getComputedStyle(_MessageWrapper);return _Message.scrollHeight+parseFloat(wrapperStyles.getPropertyValue("padding-top"))+parseFloat(wrapperStyles.getPropertyValue("padding-bottom"))}};this.Close=function(){if(_Interval)clearInterval(_Interval);var snackbarHeight=_Element.scrollHeight;// get the auto height as a px value
 var snackbarTransitions=_Element.style.transition;_Element.style.transition="";requestAnimationFrame(function(){_Element.style.height=snackbarHeight+"px";// set the auto height to the px height
 _Element.style.opacity=1;_Element.style.marginTop="0px";_Element.style.marginBottom="0px";_Element.style.transition=snackbarTransitions;requestAnimationFrame(function(){_Element.style.height="0px";_Element.style.opacity=0})});setTimeout(function(){_Container.removeChild(_Element)},1000)};_create();_This.Open()}
diff --git a/index.html b/index.html
index 3b35e81..fa762b2 100644
--- a/index.html
+++ b/index.html
@@ -38,17 +38,23 @@ <h1>JS-Snackbar</h1>
 
             <ul class="nav-ul">
                 <li class="nav-li">
-                    <a href="#Colors" class="nav-a">
-                        Context Colors
-                    </a>
+                    <a href="#message" class="nav-a">Content</a>
                 </li>
 
                 <li class="nav-li">
-                    <a href="#message" class="nav-a">Content</a>
+                    <a href="#width" class="nav-a">Width</a>
                 </li>
 
                 <li class="nav-li">
-                    <a href="#width" class="nav-a">Width</a>
+                    <a href="#Colors" class="nav-a">
+                        Context Colors
+                    </a>
+                </li>
+
+                <li class="nav-li">
+                    <a href="#icons" class="nav-a">
+                        Icons
+                    </a>
                 </li>
 
                 <li class="nav-li">
@@ -390,6 +396,148 @@ <h2 class="section-title">Context Colors</h2>
                 </script>
             </article>
 
+            <article id="icons" class="section">
+                <h2 class="section-title">Icons</h2>
+
+                <p>
+                    Icons can add additional flair to your messages, so the SnackBar comes with several built-in.
+                    These icons are simply monospace text, and so can also be customized to any single character.
+                    Keep in mind, however, that monospaces characters are serif fonts in all modern browsers.
+                    If you are looking for more customization, then you'll need to roll some custom CSS to
+                    target the icons.
+                </p>
+
+                <code block>Snackbar({
+    status: "success",
+    icon: "plus"
+})</code>
+
+                <p class="alert">
+                    While the icons and the colors can be mixed and matched, the icons
+                    <strong>require a <a href="#Colors">status color</a> to be set</strong> in order to appear.
+                </p>
+
+                <table>
+                    <thead>
+                        <tr>
+                            <td>Icon</td>
+                            <td>Value(s)</td>
+                            <td>Example</td>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            <td>!</td>
+                            <td>
+                                <code>"exclamation"</code>,
+                                <code>"warn"</code>,
+                                <code>"danger"</code>
+                            </td>
+                            <td>
+                                <span class="js-snackbar js-snackbar--show">
+                                    <span class="js-snackbar__status js-snackbar--danger">
+                                        <span class="js-snackbar__icon">!</span>
+                                    </span>
+                                    <div class="js-snackbar__message-wrapper">
+                                        <span class="js-snackbar__message demo-message">Exclamation</span>
+                                    </div>
+                                </span>
+                            </td>
+                        </tr>
+                        <tr>
+                            <td>?</td>
+                            <td>
+                                <code>"question"</code>,
+                                <code>"question-mark"</code>,
+                                <code>"info"</code>
+                            </td>
+                            <td>
+                                <span class="js-snackbar js-snackbar--show">
+                                    <span class="js-snackbar__status js-snackbar--warning">
+                                        <span class="js-snackbar__icon">?</span>
+                                    </span>
+                                    <div class="js-snackbar__message-wrapper">
+                                        <span class="js-snackbar__message demo-message">Question</span>
+                                    </div>
+                                </span>
+                            </td>
+                        </tr>
+                        <tr>
+                            <td>+</td>
+                            <td>
+                                <code>"add"</code>,
+                                <code>"plus"</code>
+                            </td>
+                            <td>
+                                <span class="js-snackbar js-snackbar--show">
+                                    <span class="js-snackbar__status js-snackbar--success">
+                                        <span class="js-snackbar__icon">+</span>
+                                    </span>
+                                    <div class="js-snackbar__message-wrapper">
+                                        <span class="js-snackbar__message demo-message">Plus</span>
+                                    </div>
+                                </span>
+                            </td>
+                        </tr>
+                        <tr>
+                            <td>Custom</td>
+                            <td>
+                                Any character
+                            </td>
+                            <td>
+                                <span class="js-snackbar js-snackbar--show">
+                                    <span class="js-snackbar__status js-snackbar--info">
+                                        <span class="js-snackbar__icon">R</span>
+                                    </span>
+                                    <div class="js-snackbar__message-wrapper">
+                                        <span class="js-snackbar__message demo-message">Custom</span>
+                                    </div>
+                                </span>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+
+                <button class="button" onclick="icons_exclamation()">!</button>
+                <button class="button" onclick="icons_question()">?</button>
+                <button class="button" onclick="icons_add()">+</button>
+                <button class="button" onclick="icons_any()">Custom</button>
+
+                <script>
+                    var icons_exclamation = function() {
+                        SnackBar({
+                            message: "How exciting",
+                            icon: "exclamation",
+                            status: "danger",
+                        })
+                    }
+
+                    var icons_question = function() {
+                        SnackBar({
+                            message: "That's questionable",
+                            icon: "question",
+                            status: "warn"
+                        });
+                    }
+
+                    var icons_add = function() {
+                        SnackBar({
+                            message: "You've added it successfully",
+                            icon: "add",
+                            status: "success"
+                        })
+                    }
+
+                    var icons_any = function() {
+                        SnackBar({
+                            message: "My name is Mike",
+                            icon: "M",
+                            status: "info"
+                        })
+                    }
+                </script>
+            </article>
+
             <article id="Timeout" class="section">
                 <h2 class="section-title">Timeout Options</h2>
 
diff --git a/src/js-snackbar.css b/src/js-snackbar.css
index 8cf0856..e8665b1 100644
--- a/src/js-snackbar.css
+++ b/src/js-snackbar.css
@@ -97,7 +97,7 @@
 
 .js-snackbar__status {
     display: none;
-    width: 15px;
+    min-width: 15px;
     margin-right: 5px;
     border-radius: 3px 0 0 3px;
     background-color: transparent;
@@ -107,7 +107,9 @@
  .js-snackbar__status.js-snackbar--warning,
  .js-snackbar__status.js-snackbar--danger,
  .js-snackbar__status.js-snackbar--info {
-    display: block;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
 
 .js-snackbar__status.js-snackbar--success  {
@@ -126,6 +128,18 @@
     background-color: #2196f3;
 }
 
+.js-snackbar__icon {
+    display: block;
+    border: 2px solid white;
+    font-weight: bold;
+    border-radius: 20px;
+    height: 20px;
+    width: 20px;
+    text-align: center;
+    margin: 0 5px;
+    font-family: monospace;
+}
+
 .js-snackbar__action {
     display: flex;
     align-items: center;
diff --git a/src/js-snackbar.js b/src/js-snackbar.js
index e3bdbe4..f07c99b 100644
--- a/src/js-snackbar.js
+++ b/src/js-snackbar.js
@@ -30,7 +30,8 @@
             position: userOptions?.position ?? "br",
             container: userOptions?.container ?? document.body,
             width: userOptions?.width,
-            speed: userOptions?.speed
+            speed: userOptions?.speed,
+            icon: userOptions?.icon
         };
     }
 
@@ -123,7 +124,7 @@
             var innerSnack = document.createElement("div");
             innerSnack.classList.add("js-snackbar", "js-snackbar--show");
 
-            applyColorTo(innerSnack);
+            applyColorAndIconTo(innerSnack);
             insertMessageTo(innerSnack);
             addActionsTo(innerSnack);
             addDismissButtonTo(innerSnack);
@@ -131,34 +132,73 @@
             return innerSnack;
         }
 
-        function applyColorTo(element) {
+        function applyColorAndIconTo(element) {
             if (!_Options.status) return;
 
             var status = document.createElement("span");
             status.classList.add("js-snackbar__status");
 
-            switch (_Options.status)
-            {
-                case "success":
-                case "green":
-                    status.classList.add("js-snackbar--success");
-                    break;
-                case "warning":
-                case "alert":
-                case "orange":
-                    status.classList.add("js-snackbar--warning");
-                    break;
-                case "danger":
-                case "error":
-                case "red":
-                    status.classList.add("js-snackbar--danger");
-                    break;
-                default:
-                    status.classList.add("js-snackbar--info");
-                    break;
-            }
+            applyColorTo(status);
+            applyIconTo(status);
 
             element.appendChild(status);
+
+            function applyColorTo(element) {
+                switch (_Options.status)
+                {
+                    case "success":
+                    case "green":
+                        element.classList.add("js-snackbar--success");
+                        break;
+                    case "warning":
+                    case "alert":
+                    case "orange":
+                        element.classList.add("js-snackbar--warning");
+                        break;
+                    case "danger":
+                    case "error":
+                    case "red":
+                        element.classList.add("js-snackbar--danger");
+                        break;
+                    default:
+                        element.classList.add("js-snackbar--info");
+                        break;
+                }
+            }
+
+            function applyIconTo(element) {
+                if (!_Options.icon) return;
+
+                var icon = document.createElement("span");
+                icon.classList.add("js-snackbar__icon");
+
+                switch (_Options.icon)
+                {
+                    case "exclamation":
+                    case "warn":
+                    case "danger":
+                        icon.innerText = "!";
+                        break;
+                    case "info":
+                    case "question":
+                    case "question-mark":
+                        icon.innerText = "?";
+                        break;
+                    case "plus":
+                    case "add":
+                        icon.innerText = "+";
+                        break;
+                    default:
+                        if (_Options.icon.length > 1) {
+                            console.warn("Invalid icon character provided: ", _Options.icon);
+                        }
+
+                        icon.innerText = _Options.icon.substr(0, 1);
+                        break;
+                }
+
+                element.appendChild(icon);
+            }
         }
 
         function insertMessageTo(element) {