diff --git a/coffee/chosen.jquery.coffee b/coffee/chosen.jquery.coffee
index 203af36aeda..98e75434e4e 100644
--- a/coffee/chosen.jquery.coffee
+++ b/coffee/chosen.jquery.coffee
@@ -279,12 +279,18 @@ class Chosen extends AbstractChosen
     if @form_field_label.length > 0
       @form_field_label.on 'click.chosen', this.label_click_handler
 
+  set_search_field_placeholder: ->
+    if @is_multiple and this.choices_count() < 1
+      @search_field.attr('placeholder', @default_text)
+    else
+      @search_field.attr('placeholder', '')
+
   show_search_field_default: ->
+    @search_field.val('')
+    do @set_search_field_placeholder
     if @is_multiple and this.choices_count() < 1 and not @active_field
-      @search_field.val(@default_text)
       @search_field.addClass "default"
     else
-      @search_field.val("")
       @search_field.removeClass "default"
 
   search_results_mouseup: (evt) ->
@@ -329,6 +335,7 @@ class Chosen extends AbstractChosen
 
       link.parents('li').first().remove()
 
+      do @set_search_field_placeholder
       this.search_field_scale()
 
   results_reset: ->
@@ -494,7 +501,7 @@ class Chosen extends AbstractChosen
       style_block[style] = @search_field.css(style)
 
     div = $('<div />').css(style_block)
-    div.text this.get_search_field_value()
+    div.text @get_search_field_value() || @search_field.attr('placeholder')
     $('body').append div
 
     width = div.width() + 25
diff --git a/coffee/chosen.proto.coffee b/coffee/chosen.proto.coffee
index 654a905507f..6b5f225bc54 100644
--- a/coffee/chosen.proto.coffee
+++ b/coffee/chosen.proto.coffee
@@ -271,12 +271,18 @@ class @Chosen extends AbstractChosen
     if @form_field_label?
       @form_field_label.observe "click", this.label_click_handler
 
+  set_search_field_placeholder: ->
+    if @is_multiple and this.choices_count() < 1
+      @search_field.placeholder = @default_text
+    else
+      @search_field.placeholder = ''
+
   show_search_field_default: ->
+    @search_field.value = ""
+    do @set_search_field_placeholder
     if @is_multiple and this.choices_count() < 1 and not @active_field
-      @search_field.value = @default_text
       @search_field.addClassName "default"
     else
-      @search_field.value = ""
       @search_field.removeClassName "default"
 
   search_results_mouseup: (evt) ->
@@ -321,6 +327,7 @@ class @Chosen extends AbstractChosen
 
       link.up('li').remove()
 
+      do @set_search_field_placeholder
       this.search_field_scale()
 
   results_reset: ->
@@ -491,7 +498,7 @@ class @Chosen extends AbstractChosen
     for style in styles
       style_block[style] = @search_field.getStyle(style)
 
-    div = new Element('div').update(this.escape_html(this.get_search_field_value()))
+    div = new Element('div').update(this.escape_html(this.get_search_field_value() || @search_field.placeholder))
     # CSP without 'unsafe-inline' doesn't allow setting the style attribute directly
     div.setStyle(style_block)
     document.body.appendChild(div)
diff --git a/coffee/lib/abstract-chosen.coffee b/coffee/lib/abstract-chosen.coffee
index a83c194f826..4b63e328dc8 100644
--- a/coffee/lib/abstract-chosen.coffee
+++ b/coffee/lib/abstract-chosen.coffee
@@ -347,7 +347,7 @@ class AbstractChosen
     """
       <ul class="chosen-choices">
         <li class="search-field">
-          <input class="chosen-search-input" type="text" autocomplete="off" value="#{@default_text}" />
+          <input class="chosen-search-input" type="text" autocomplete="off" placeholder="#{@default_text}" />
         </li>
       </ul>
       <div class="chosen-drop">
diff --git a/sass/chosen.scss b/sass/chosen.scss
index c5d776b287d..1d777cb944d 100644
--- a/sass/chosen.scss
+++ b/sass/chosen.scss
@@ -224,7 +224,6 @@ $chosen-sprite-retina: url('chosen-sprite@2x.png') !default;
         border: 0 !important;
         background: transparent !important;
         box-shadow: none;
-        color: #999;
         font-size: 100%;
         font-family: sans-serif;
         line-height: normal;
@@ -318,9 +317,6 @@ $chosen-sprite-retina: url('chosen-sprite@2x.png') !default;
   .chosen-choices {
     border: 1px solid #5897fb;
     box-shadow: 0 0 5px rgba(#000,.3);
-    li.search-field input[type="text"] {
-      color: #222 !important;
-    }
   }
 }
 /* @end */