demo · v144

Caret Shape Picker

Click into the editor and pick a caret shape. The shape applies live via the new CSS caret-shape property. Browsers without support show a regular bar caret — the readout tells you which.

browser support: checking…
Type here and watch the caret shape change.
current: checking computed style…

the API

input, textarea, [contenteditable] {
  caret-shape: block;   /* or: bar, underscore, auto */
}

see also