Как реализовать такое подчеркивание в CSS?

Question

Как реализовать такое подчеркивание в CSS заголовка h1?

Answer 1

Возможно, придется поиграть с параметрами градиента для разных шрифтов (т.к. у них разное расстояние от базовой линии до нижней).

h1 {
  background-image: linear-gradient(0, transparent 0.22em, orange 0.22em, orange 0.35em, transparent 0.35em);
  display: inline;
}

<h1>Lorem ipsum dolor sit amet<br> Lorem ipsum dolor sit<br> amet Lorem ipsum dolor sit amet</h1>