paint-order が Chrome で実装されるので、HTML+CSSで縁取り文字

もともとSVGではできていましたが、Chrome123がHTMLでのpaint-orderに対応するようなので、プラウザ互換を気にせずに使えるようになりそうです。白系の背景に白文字を乗せるときとかに重宝します。

See the Pen paint-order by lhankor_mhy (@lhankor_mhy) on CodePen.

上の文字がpaint-orderの指定なし、下の文字がpaint-order: strokeです。

div{
  color: white;
  -webkit-text-stroke: #00000066 4px;
}
div+div{
  paint-order: stroke;  
}

Illustrator とかを使ってれば、あーあれね、という感じになるかと思いますが、線を塗りの後ろに回すやり方です。たぶん、Illustrator9 あたりのアピアランスとかで使えるようになった機能だと思うんですが、それまでは同じ文字を2つ書いてレイヤーで重ねたような記憶があります。なつい。