CSS caret-color Property
Example
Set the color of the cursor in input elements:
    input { 
  caret-color: red;
}
Try it Yourself »
 
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: | 
     Read about animatable
   | 
  
  
    | Version: | 
    CSS3 | 
  
  
    | JavaScript syntax: | 
      object.style.caretColor="red"
Try it    
 | 
  
 
 
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
  
    | Property | 
     | 
     | 
     | 
     | 
     |                 
  
  
    | caret-color | 
    57.0 | 
    Not supported | 
    53.0 | 
    11.1 | 
    44.0 | 
  
  
 
CSS Syntax
Property Values
  
    | 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 |