diff --git a/src/assets/styles/components/_search.scss b/src/assets/styles/components/_search.scss
index c5d7f339..f20cabec 100644
--- a/src/assets/styles/components/_search.scss
+++ b/src/assets/styles/components/_search.scss
@@ -65,6 +65,10 @@
 		border-right-color: $grey-300;
 		border-right-width: rem(1);
 
+		&::placeholder {
+			color: transparent;
+		}
+
 		&:hover {
 			border-color: $blue-300;
 		}
@@ -104,3 +108,48 @@
 		}
 	}
 }
+
+.home .search-form.search-form--inverse {
+	[type="search"] {
+		box-shadow: 0 rem(3) rem(6) rgba(0, 0, 0, 0.16);
+	}
+
+	@include breakpoint-up(sm) {
+		[type="search"] {
+			height: rem(60);
+
+			&:focus {
+				box-shadow: 0 0 0 rem(2) $blue-300 inset;
+			}
+
+			&::placeholder {
+				color: $grey-500;
+				opacity: 1;
+			}
+		}
+
+		[type="submit"] {
+			height: rem(60);
+			width: rem(60);
+
+			&::before {
+				height: rem(56);
+			}
+		}
+	}
+
+	@include breakpoint-up(lg) {
+		[type="search"] {
+			height: rem(70);
+		}
+
+		[type="submit"] {
+			height: rem(70);
+			width: rem(70);
+
+			&::before {
+				height: rem(66);
+			}
+		}
+	}
+}
diff --git a/src/components/02-molecules/07-search/search.config.js b/src/components/02-molecules/07-search/search.config.js
index 6bf3c39b..9611ab5d 100644
--- a/src/components/02-molecules/07-search/search.config.js
+++ b/src/components/02-molecules/07-search/search.config.js
@@ -15,6 +15,15 @@ module.exports = {
 				modifier: 'inverse',
 				bodyClass: 'has-blue-700-background-color'
 			}
+		},
+		{
+			name: 'Home',
+			label: 'Home',
+			context: {
+				modifier: 'inverse',
+				placeholder: 'Search resource name, publisher, or topic…',
+				bodyClass: 'has-blue-400-background-color home'
+			}
 		}
 	]
 };
diff --git a/src/components/02-molecules/07-search/search.njk b/src/components/02-molecules/07-search/search.njk
index 867511ac..aa300950 100644
--- a/src/components/02-molecules/07-search/search.njk
+++ b/src/components/02-molecules/07-search/search.njk
@@ -2,7 +2,7 @@
 <form role="search" method="get" class="search-form{% if modifier %} search-form--{{ modifier }}{% endif %}" action="/">
 	<label>
 		<span class="screen-reader-text">{{ label }}</span>
-		<input id="{{ name }}" name="{{ name }}" type="search"{% if disabled %} disabled{% endif %} />
+		<input id="{{ name }}" name="{{ name }}" {% if placeholder %}placeholder="{{ placeholder }}" {% endif %} type="search"{% if disabled %} disabled{% endif %} />
 	</label>
 	<button type="submit" class="search-submit"><span class="screen-reader-text">{{ submitLabel }}</span>{% render '@svg', {svg: 'search'}, true %}</button>
 </form>