How to make a border-only text in CSS/Javascript [duplicate]

Question

I'm trying to reproduce this kind of text, with transparency inside of it and only a border :

Is this possible to make this in CSS, even with Javascript ?

Answer 1

Using text-stroke:

span {
  font-size: 8rem;
  color: black;
  -webkit-text-fill-color: transparent; /* Will override color (regardless of order) */
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: black;
}

<span>ICY</span>

Answer 2

You can do it by :

  color: transparent;
  -webkit-text-fill-color: transparent; /* Will override color (regardless of order) */
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: white;

Reference: https://css-tricks.com/adding-stroke-to-web-text/