diff --git a/frappe/public/js/print_format_builder/Preview.vue b/frappe/public/js/print_format_builder/Preview.vue
index 91103cc6b7..35105dee6c 100644
--- a/frappe/public/js/print_format_builder/Preview.vue
+++ b/frappe/public/js/print_format_builder/Preview.vue
@@ -2,10 +2,10 @@
 	<div class="h-100">
 		<div class="row">
 			<div class="col">
-				<div ref="doc-select"></div>
+				<div class="preview-control" ref="doc-select"></div>
 			</div>
 			<div class="col">
-				<div ref="preview-type"></div>
+				<div class="preview-control" ref="preview-type"></div>
 			</div>
 			<div class="col d-flex">
 				<a
@@ -126,4 +126,7 @@ export default {
 	margin-top: auto;
 	margin-bottom: 1.2rem;
 }
+.preview-control >>> .form-control {
+	background: var(--control-bg-on-gray);
+}
 </style>