Ionic 2 placeholder text styling

With Ionic2 RC4, you have to add the following line in your app.scss file:

.text-input::-moz-placeholder {
  color: white;
}

.text-input:-ms-input-placeholder {
  color: white;
}

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

Just do the ::placeholder selector, i.e.

<ion-input placeholder="enter placeholder here..." class="custom-input" type="text"></ion-input>

and in css just call it like

ion-input {
  &.custom-input {
    font-size: 20px; //sets text font size
    ::placeholder {
      font-size: 12px; //sets placeholder font size
    }
  }
}

Ionic 2 provides sass variable overrides you can use to easily change the style.

theme/variables.scss

$text-input-placeholder-color:(#000);