CSSのみで、svg画像を使い、手書き風の色付きアンダーラインでテキストを強調します。サンプルは、h1要素およびp要素に内包するstrong要素で囲んだテキスト部分にsvgアンダーラインを適用しています。

使用したsvg画像の手書き風アンダーライン（筆者のオリジナルです）

サンプル

サンプルのhtmlソース

<h1>ダミーテキスト（h1要素）：svg画像を使い、手書き風<strong>アンダーライン</strong>で、テキストを
    <strong>強調</strong>します。</h1> 
<p>ダミーテキスト（p要素）：<strong>吾輩は猫である</strong>。名前はまだ無い。どこで生れたかとんと見当が
    つかぬ。何でも薄暗いじめじめした所で<strong>ニャーニャー</strong>泣いていた事だけは記憶している。</p>

サンプルのCSSソース

.main strong {
    position: relative;
}
.main strong::after {
    content: '';
    position: absolute;
    bottom: -0.4rem;
    left: -0.5rem;
   right: -0.5rem;
   height: 0.6rem;
   z-index: -1;
   background-image: url("underline223.svg");
   background-repeat: none;
   background-size: cover;
}
.main p > strong, .main h1 > strong {
   font-weight: 400;
}
.main p > strong::after {
   bottom: -0.2rem;
   height: 0.5rem;
   left: -0.25rem;
   right: -0.25rem;
}