diff --git a/l10n/en-US/viewer.properties b/l10n/en-US/viewer.properties
index da5442c68..27939c13b 100644
--- a/l10n/en-US/viewer.properties
+++ b/l10n/en-US/viewer.properties
@@ -121,7 +121,8 @@ thumb_page_title=Page {{page}}
 thumb_page_canvas=Thumbnail of Page {{page}}
 
 # Find panel button title and messages
-find_label=Find:
+find_input.title=Find
+find_input.placeholder=Find in document…
 find_previous.title=Find the previous occurrence of the phrase
 find_previous_label=Previous
 find_next.title=Find the next occurrence of the phrase
diff --git a/l10n/nl/viewer.properties b/l10n/nl/viewer.properties
index fedc5fa59..ad254db04 100644
--- a/l10n/nl/viewer.properties
+++ b/l10n/nl/viewer.properties
@@ -120,7 +120,8 @@ thumb_page_title=Pagina {{page}}
 thumb_page_canvas=Miniatuur van pagina {{page}}
 
 # Find panel button title and messages
-find_label=Zoeken:
+find_input.title=Zoeken
+find_input.placeholder=Zoeken in document…
 find_previous.title=De vorige overeenkomst van de tekst zoeken
 find_previous_label=Vorige
 find_next.title=De volgende overeenkomst van de tekst zoeken
diff --git a/l10n/sv-SE/viewer.properties b/l10n/sv-SE/viewer.properties
index c1ff607c0..229c4a358 100644
--- a/l10n/sv-SE/viewer.properties
+++ b/l10n/sv-SE/viewer.properties
@@ -121,7 +121,8 @@ thumb_page_title=Sida {{page}}
 thumb_page_canvas=Miniatyr av sida {{page}}
 
 # Find panel button title and messages
-find_label=Sök:
+find_input.title=Sök
+find_input.placeholder=Sök i dokumentet…
 find_previous.title=Hitta föregående förekomst av frasen
 find_previous_label=Föregående
 find_next.title=Hitta nästa förekomst av frasen
diff --git a/web/viewer.css b/web/viewer.css
index 612172e0c..b6e567521 100644
--- a/web/viewer.css
+++ b/web/viewer.css
@@ -372,6 +372,21 @@ html[dir='rtl'] .findbar {
   -moz-user-select: none;
 }
 
+#findInput {
+  width: 200px;
+}
+#findInput::-webkit-input-placeholder {
+  font-style: italic;
+}
+#findInput::-moz-placeholder {
+  font-style: italic;
+}
+#findInput:-ms-input-placeholder {
+  font-style: italic;
+}
+#findInput::placeholder {
+  font-style: italic;
+}
 #findInput[data-status="pending"] {
   background-image: url(images/loading-small.png);
   background-repeat: no-repeat;
diff --git a/web/viewer.html b/web/viewer.html
index 26af8f447..ea357475e 100644
--- a/web/viewer.html
+++ b/web/viewer.html
@@ -98,8 +98,7 @@ See https://github.com/adobe-type-tools/cmap-resources
 
       <div id="mainContainer">
         <div class="findbar hidden doorHanger hiddenSmallView" id="findbar">
-          <label for="findInput" class="toolbarLabel" data-l10n-id="find_label">Find:</label>
-          <input id="findInput" class="toolbarField" tabindex="91">
+          <input id="findInput" class="toolbarField" title="Find" placeholder="Find in document" tabindex="91" data-l10n-id="find_input">
           <div class="splitToolbarButton">
             <button class="toolbarButton findPrevious" title="" id="findPrevious" tabindex="92" data-l10n-id="find_previous">
               <span data-l10n-id="find_previous_label">Previous</span>