CSS Change Color Of Focus Rectangle (Location Focus)

Question

I have a textarea with transparent text. I need it to be transparent to work around a problem I'm having with Highlight.js.

It works fine, but there is a problem though. The user doesn't know where he is in the textarea. I need the focus rectangle (that's what it's called in the Windows UI apparently) to have specific properties. In this case it must be white and flickering. The rest of the text should stay transparent.

textarea {
  color: transparent;
  z-index: 1;
}

Like that, but with a white focus rectangle.

EDIT:

People seem to misunderstand me. I don't want to edit the cursor. I want the edit the vertical flickering dash that indicated where you're editing in the textarea.

EDIT2:

It's called a caret apparently.

Answer 1

Hey You can refer the following Blog for your requiremenr :

https://beradrian.wordpress.com/2008/01/08/cross-browser-custom-css-cursors/

Let me know if is it helpfull to you.

code:

input, textarea {
    cursor: url(cursor.cur);
}