diff --git a/static/styles/zulip.css b/static/styles/zulip.css
index b09f47c0aa..aa47529bc7 100644
--- a/static/styles/zulip.css
+++ b/static/styles/zulip.css
@@ -4,6 +4,10 @@ html {
     overflow-x: hidden;
 }
 
+#css-loading {
+    display: none !important; /* We are now loaded, by definition. */
+}
+
 body {
     font-family: 'Humbug', 'Helvetica Neue', Helvetica, Arial, sans-serif;
     overflow-y: auto;
diff --git a/templates/zerver/index.html b/templates/zerver/index.html
index 44c2b9e027..0c5979b1a8 100644
--- a/templates/zerver/index.html
+++ b/templates/zerver/index.html
@@ -17,6 +17,19 @@ var page_params = {{ page_params }};
 
 {% block customhead %}
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
+<style type="text/css">
+
+#css-loading {
+    background: white;
+    position: fixed;
+    height: 100%;
+    width: 100%;
+    padding: 0px;
+    top: 0px;
+    left: 0px;
+}
+
+</style>
 
 {% if nofontface %}
 {# We can't use @font-face on qtwebkit, so use differently minified CSS #}
@@ -32,6 +45,11 @@ var page_params = {{ page_params }};
 
 {% endblock %}
 {% block content %}
+<div id="css-loading">
+    <h3>Loading CSS...</h3>
+    <p>If this message does not go away, please wait a couple seconds and reload the page.</p>
+</div>
+
 <div id="top-screen" class="screen"></div>
 <div id="bottom-screen" class="screen"></div>
 <div id="left-screen" class="screen"></div>