Style caretColor attribute

Definition and Usage

caretColor This attribute specifies the color of the cursor (insertion symbol) in input, text area, or any editable element.

See also:

CSS Reference Manual:caret-color attribute

Example

Set the cursor color within the input field to red:

document.getElementById("input1").style.caretColor = "red";

Try it yourself

Syntax

Return caretColor attribute:

object.style.caretColor

Set caretColor attribute:

object.style.caretColor = "auto|color|initial|inherit"

Attribute value

Value Description
auto Default. Browsers use currentColor for insertion symbols.
color

Specifies the color used for insertion symbols. All valid color values (rgb, hex, named colors, etc.) can be used.

For more information on valid values, please read our CSS Color Tutorial.
initial Sets this attribute to its default value. See initial.
inherit Inherits this attribute from its parent element. See inherit.

Technical details

Default value: auto
Return value: A string representing the insertion symbol color of the element.
CSS version: CSS3

Browser support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
57.0 79.0 53.0 11.1 44.0