diff --git a/app/assets/javascripts/common.js b/app/assets/javascripts/common.js
index 31b6ce685..6fcd92c5c 100644
--- a/app/assets/javascripts/common.js
+++ b/app/assets/javascripts/common.js
@@ -15,6 +15,10 @@ $(function() {
     Danbooru.Cookie.put('hide_upgrade_account_notice', '1', 7);
     e.preventDefault();
   });
+
+  $("#close-notice-link").click(function(e) {
+    $('#notice').fadeOut("fast");
+  });
 });
 
 var Danbooru = {};
diff --git a/app/assets/javascripts/utility.js b/app/assets/javascripts/utility.js
index 4058cfeab..42251bab7 100644
--- a/app/assets/javascripts/utility.js
+++ b/app/assets/javascripts/utility.js
@@ -22,11 +22,11 @@
   }
 
   Danbooru.notice = function(msg) {
-    $('#notice').html(msg).addClass("ui-state-highlight").removeClass("ui-state-error").fadeIn("fast");
+    $('#notice').addClass("ui-state-highlight").removeClass("ui-state-error").fadeIn("fast").children("span").html(msg);
   }
 
   Danbooru.error = function(msg) {
-    $('#notice').html(msg).removeClass("ui-state-highlight").addClass("ui-state-error").fadeIn("fast");
+    $('#notice').removeClass("ui-state-highlight").addClass("ui-state-error").fadeIn("fast").children("span").html(msg);
     Danbooru.scroll_to($("#notice"));
   }
 
diff --git a/app/assets/stylesheets/common/notices.css.scss b/app/assets/stylesheets/common/notices.css.scss
index 08db43bbe..39478cd17 100644
--- a/app/assets/stylesheets/common/notices.css.scss
+++ b/app/assets/stylesheets/common/notices.css.scss
@@ -12,3 +12,7 @@ div#notice {
   margin: 1em 0;
   padding: 1em;
 }
+
+a#close-notice-link {
+  float: right;
+}
diff --git a/app/views/layouts/default.html.erb b/app/views/layouts/default.html.erb
index ac6718810..5991d24d7 100644
--- a/app/views/layouts/default.html.erb
+++ b/app/views/layouts/default.html.erb
@@ -56,11 +56,10 @@
       <%= render "users/tos" %>
     <% end %>
 
-    <%- if flash[:notice] -%>
-      <div class="ui-corner-all ui-state-highlight" id="notice"><%= flash[:notice] %></div>
-    <%- else -%>
-      <div class="ui-corner-all ui-state-highlight" id="notice" style="display: none;"></div>
-    <%- end -%>
+    <div class="ui-corner-all ui-state-highlight" id="notice" style="<%= "display: none;" unless flash[:notice] %>">
+      <span><%= flash[:notice] %></span>
+      <a href="#" id="close-notice-link">close</a>
+    </div>
 
     <%= yield :layout %>
   </div>