# Ion-list input placeholder color

**URL:** <https://forum.ionicframework.com/t/ion-list-input-placeholder-color/20559>\
**Category:** ionic-v1\
**Created:** [April 8, 2015, 7:27pm UTC](https://forum.ionicframework.com/t/ion-list-input-placeholder-color/20559 "2015-04-08T19:27:29Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![heems](https://avatars.discourse-cdn.com/v4/letter/h/a8b319/32.png) [@heems](https://forum.ionicframework.com/u/heems)\
**Post date:** [April 8, 2015, 7:27pm UTC](https://forum.ionicframework.com/t/ion-list-input-placeholder-color/20559/1 "2015-04-08T19:27:29Z")

</div>

Am looking to change the placeholder text color in an input field inside an ion-item. I tried the following but it doesn’t seem to work.

```
<style>
 *::-webkit-input-placeholder {
    color: blue;
  }
</style>

<ion-list>           
        <ion-item class="item-input">
            <span class="input-label">Address</span>
            <input type="text" placeholder="Current Location">
        </ion-item>
</ion-list>
```

---

<div class="post-metadata">

**Author:** ![heems](https://avatars.discourse-cdn.com/v4/letter/h/a8b319/32.png) [@heems](https://forum.ionicframework.com/u/heems)\
**Post date:** [April 8, 2015, 7:35pm UTC](https://forum.ionicframework.com/t/ion-list-input-placeholder-color/20559/2 "2015-04-08T19:35:02Z")

</div>

```
input::-webkit-input-placeholder {
 color: blue;

```

}

did the trick…

---

<div class="post-metadata">

**Author:** ![HermanSynerics](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/hermansynerics/32/100933_2.png) [@HermanSynerics](https://forum.ionicframework.com/u/HermanSynerics)\
**Post date:** [June 6, 2016, 2:30pm UTC](https://forum.ionicframework.com/t/ion-list-input-placeholder-color/20559/3 "2016-06-06T14:30:08Z")

</div>

I suggest rather using sass and override the \_variables.scss with:  
`$input-color-placeholder: lighten($dark, 40%) !default;`  
to  
`$input-color-placeholder: lighten($positive, 40%) !default;`  
or something like that.

---

<div class="post-metadata">

**Author:** ![abhayshiro](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/abhayshiro/32/105652_2.png) [@abhayshiro](https://forum.ionicframework.com/u/abhayshiro)\
**Post date:** [April 4, 2017, 7:29am UTC](https://forum.ionicframework.com/t/ion-list-input-placeholder-color/20559/4 "2017-04-04T07:29:37Z")

</div>

input::-moz-placeholder {  
color: red;  
}

input:-ms-input-placeholder {  
color: red;  
}

input::-webkit-input-placeholder {  
text-indent: 0;  
color: red;  
}

This will also work.