<div class="container">
  <input type="text" value="Trường này con trỏ có màu mặc định" autocomplete="off">
  <input type="text" value="Trường này con trỏ có màu đỏ" class="custom" autocomplete="off">
  <p class="custom" contenteditable="true">Đoạn văn bản này chỉnh sửa được. Màu con trỏ cũng đã đổi thành xanh</p>
</div>
body {
  height: 100vh;
  display: grid;
  place-items: center;
  font-family: Arial, sans-serif;
}

.container {
  width: calc(100% - 9em);
}

input {
  caret-color: auto;
  display: block;
  margin-bottom: .5em;
  width: 100%;
  font-family: Arial, sans-serif;
  height: 25px;
}

input.custom {
  caret-color: red;
}

p.custom {
  caret-color: green;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.