DevToolBox

CSSテキストストロークジェネレーター

テキストにストローク(縁取り)効果を追加するCSSコードを生成。リアルタイムプレビュー付き。

設定

CSS コード

-webkit-text-stroke: 1px #ffffff;
-webkit-text-fill-color: #000000;
color: #000000;

プレビュー

サンプルテキスト

使い方

  • ストローク幅で縁取りの太さを調整できます
  • ストローク色で縁取りの色を設定します
  • 塗りつぶし色で文字内部の色を設定します(transparentも可)
  • 生成されたCSSコードをコピーしてプロジェクトに貼り付けてください
  • -webkit- プレフィックスが必要なため、主にChrome/Safari/Edgeで動作します