Input cursor color

Question

How to change the color of content in HTML input type text while entering some value. And also the cursor color when it has focus.

Answer 1

Changing the colour when entering content is easy:

input:focus { color: yellow }

not supported by IE7 and lower. Compatibility table here.

Changing the cursor colour specifically is impossible as far as I know. It will usually take on the text content's colour which should be fine in most cases.

Answer 2

Use color to specify the text color. Use caret-color to specify the caret's color.

HTML

<input class="examples" />
<textarea class="examples"></textarea>

CSS

.examples {
  color: gray;
  caret-color: red;
}

Answer 3

Use modern CSS!

input {
    caret-color : red;
}
input:focus {
    color : yellow;
}