diff --git a/css/client.css b/css/client.css
index cc59305..ba65ad6 100644
--- a/css/client.css
+++ b/css/client.css
@@ -16,6 +16,17 @@
     padding: 16px;
 }
 
+.ClientView .hostedBanner {
+    text-align: center;
+    margin-bottom: 29px;
+    padding: 4px 0;
+    line-height: 20px;
+    border-radius: 8px;
+    font-weight: bold;
+    font-size: 16px;
+    background-color: var(--lightgrey);
+}
+
 .ClientView .header {
     display: flex;
 }
diff --git a/src/open/ClientView.js b/src/open/ClientView.js
index 569ef06..408ba87 100644
--- a/src/open/ClientView.js
+++ b/src/open/ClientView.js
@@ -39,7 +39,8 @@ function renderInstructions(parts) {
 export class ClientView extends TemplateView {
 
 	render(t, vm) {
-		return t.div({className: "ClientView"}, [
+		return t.div({className: {"ClientView": true, "isPreferred": vm => vm.hasPreferredWebInstance}}, [
+            ... vm.hasPreferredWebInstance ? [t.div({className: "hostedBanner"}, vm.hostedByBannerLabel)] : [],
 			t.div({className: "header"}, [
 				t.div({className: "description"}, [
 					t.h3(vm.name),