diff --git a/Dockerfile b/Dockerfile
index 61f1816ad7c808be6c5211afb5ae033381d211e9..000db5fe30df748deb6a40b2930ba9c29f7ab944 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -4,6 +4,7 @@ ARG nginx_version=latest
 FROM nginx:${nginx_version} as nginx
 LABEL uk.org.kodo.maintainer = "Dom Sekotill <dom.sekotill@kodo.org.uk>"
 COPY data/nginx.conf /etc/nginx/conf.d/default.conf
+COPY data/5*.html /app/html/
 
 
 FROM php:7.3-fpm-alpine as deps
diff --git a/data/502.html b/data/502.html
new file mode 100644
index 0000000000000000000000000000000000000000..3e722061a0597d604be80189cd5b651b43010207
--- /dev/null
+++ b/data/502.html
@@ -0,0 +1,107 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" class="wp-toolbar" lang="en-GB">
+	<head>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" />
+		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" defer="defer"></script>
+		<title>Site Unavailable</title>
+		<script>
+			var check = false;
+
+			function sleep(delay_ms) {
+				return new Promise((resolve) => setTimeout(resolve, delay_ms));
+			}
+
+			function head(url) {
+				return new Promise((resolve, reject) => {
+					jQuery.ajax({
+						url: url,
+						method: 'HEAD',
+						success: resolve,
+						error: reject,
+					});
+				})
+			}
+
+			$(document).ready(function() {
+				$('#checkModal')
+					.on('hide.bs.modal', function() {
+						check = false;
+					})
+					.on('shown.bs.modal', async function() {
+						check = true;
+						while (check) {
+							await sleep(1000);
+							try {
+								await head('#');
+							} catch (err) {
+								if (err.status === undefined)
+									throw err;
+								if (err.status == 502)
+									continue;
+							}
+							// non-502 code received
+							window.location.reload();
+						}
+					})
+					.modal('show');
+			});
+		</script>
+		<style>
+			.vertical-center {
+				min-height: 100%;
+				min-height:100vh;
+				display: flex;
+				align-items: center;
+			}
+		</style>
+	</head>
+	<body>
+		<div class="modal fade" tabindex="-1" id="checkModal" role="dialog" aria-labelledby="#checkModalLabel">
+			<div class="modal-dialog" role="document">
+				<div class="modal-content">
+
+					<!-- header -->
+					<div class="modal-header">
+						<h4 class="modal-title" id="checkModalLabel">Site Unavailable</h4>
+					</div>
+
+					<!-- body -->
+					<div class="modal-body">
+						<p>The page will reload automatically when the site becomes
+							available &#x2026;</p>
+					</div>
+
+					<!-- footer -->
+					<div class="modal-footer">
+						<button type="button" class="btn btn-danger" data-dismiss="modal">
+							<span class="spinner-border spinner-border-sm"></span>
+							Cancel
+						</button>
+					</div>
+
+				</div>
+			</div>
+		</div>
+
+		<div class="vertical-center">
+			<div class="container">
+
+				<div class="d-flex justify-content-center align-items-center">
+					<div class="p-2">
+						<h1>Site Unavailable</h1>
+						<p>This site is currently unavailable</p>
+						<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#checkModal">
+							Check availability
+						</button>
+					</div>
+				</div>
+
+			</div>
+		</div>
+
+	</body>
+</html>
diff --git a/data/nginx.conf b/data/nginx.conf
index 551a9278d1da2acad5a5b04bbde355c2fd8e480d..d07c4c979ccc111a4c87688afc4a553d7da97c77 100644
--- a/data/nginx.conf
+++ b/data/nginx.conf
@@ -25,6 +25,13 @@ server {
 	# Add Cache-Control headers for static files, removed in *.php location
 	add_header Cache-Control "public, max-age=7776000, stale-while-revalidate=86400, stale-if-error=604800";
 
+	error_page 502 /errors/502.html;
+
+	location /errors {
+		alias /app/html;
+		internal;
+	}
+
 	location ~ \.php$ {
 		include fastcgi_params;
 		fastcgi_param SCRIPT_FILENAME /app$fastcgi_script_name;
