-1

Is there any way to outline text in my website? I am working on a project and I want to have outlined text, but I just could not find a real solution, lot of people are saying that I should use text-shadow and some other people are saying that "SVG" is better.

Is there a real solution?

Hanzilka
  • 5
  • 4
  • 1
    check this it will help https://stackoverflow.com/questions/64508701/how-can-i-place-a-div-directly-over-another-div-that-contains-content-with-a-s/64508943#64508943 – Chamsddine Bouzaine Jan 09 '21 at 21:59
  • 1
    It seems a lot of people have tried adding an outline to text, This [question](https://stackoverflow.com/questions/4919076/outline-effect-to-text) has a lot of different approaches. For what it's worth, pure css outlines are well supported on modern browsers, if you have no need for SVG, I would stick to a css solution. – Lars Jan 09 '21 at 22:03
  • @Lars ah, I used that topic as an inspiration since there wasn't a really satisfying information, but I guess that Ï'll just go with the text-shadow... – Hanzilka Jan 09 '21 at 22:13

1 Answers1

1

.stroke {
  -webkit-text-stroke: 2px limegreen;
  color: transparent;
}

.stroke-explicit {
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: red;
  color: transparent;
}

h1 {
  font-size: 60px;
}
<h1 class="stroke">Shorthand</h1>
<h1 class="stroke-explicit">Both properties</h1>
Andris Jefimovs
  • 589
  • 4
  • 16