Прозрачный ввод текста и фона с белым курсором

Question

Мне нужно сделать ввод с прозрачным цветом текста и фона;мой код SCSS:

&_transparent {
  color: transparent;
  background-color: transparent;
}

Этот простой код работает так, как мне нужно, но есть некоторая проблема - курсор тоже прозрачный.Как я мог это исправить во всех основных браузерах?Заранее спасибо.

Answer 1

.transparent {
opacity:1;
background:transparent;
}

В этом коде имя класса прозрачно, и текст не будет виден, так как непрозрачность максимальна.

Answer 2

.transparent {
  color: transparent;
  background-color: transparent;
  caret-color: red;
}

<input class="transparent" type="text">