CSS caret-color Property

Set the color of the cursor in input elements:

input {
caret-color: red;
}

Definition and Usage

The caret-color property specifies the color of the cursor (caret) in inputs, textareas, or any element that is editable.

Default value:	auto
Inherited:	yes
Animatable:	no. Read about animatable
Version:	CSS3
JavaScript syntax:	object.style.caretColor="red" Try it

The numbers in the table specify the first browser version that fully supports the property.

Property
caret-color	57.0	79.0	53.0	11.1	44.0

caret-color: auto|color|initial|inherit;

Value	Description
auto	Default. Browsers uses the currentColor for the caret
color	Specifies a color to use for the caret. All legal color values can be used (rgb, hex, named-color, etc). For more information on legal values, read our CSS Colors Tutorial
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit