# CSS text-shadowジェネレーター

> CSS text-shadowジェネレーター：オフセット、ぼかし、色を設定してCSSをコピーできます。

CSS text-shadow ジェネレーターは、コードを手動で記述せずにウェブテキストのドロップシャドウを作成できます。すべてのモダンブラウザで動作する正しい text-shadow 構文を生成します。

*Interactive tool: enter your values at https://toollantern.win/ja/css-text-shadow-generator/ and results update instantly in your browser.*

## ジェネレーターの仕組み

入力フィールドに水平オフセット、垂直オフセット、ぼかし半径、色を入力します。ツールは即座に CSS ルールとライブプレビューを表示するため、リアルタイムで値を調整できます。

## 構文の理解

text-shadow プロパティはパターン text-shadow: offset-x offset-y blur-radius color に従います。オフセットはピクセルやその他の CSS 長さ単位で測定され、ぼかし半径は鋭いエッジのために 0 にすることができ、色は任意の CSS 色形式を受け入れます。

## 効果的なシャドウのヒント

- 鋭く、オフセットされた見た目にするには、小さなぼかし半径を使用します。
- カンマで各セットを区切って複数のシャドウを重ね、最も手前のシャドウを最初に配置します。
- シャドウの色を背景と一致させて奥行きを出すか、劇的な効果を出すために対照的な色を使用します。

## その他のCSSジェネレーター

テキストシャドウと[CSS border-radiusジェネレーター](/ja/css-border-radius-generator/)を組み合わせて、角の丸いカードやボタンを作りましょう。

## よくある質問
### ジェネレーターで複数のシャドウを作成できますか？

はい、インターフェースに追加のシャドウ定義を追加すると、それらはカンマ区切りのリストに結合され、最初のエントリが最前面に描画されます。

### ぼかし半径を 0 にするとどうなりますか？

ぼかし半径を 0 にすると、指定された x 値と y 値で正確にオフセットされた硬く鋭いシャドウが生成されます。

### 生成された CSS はすべてのブラウザと互換性がありますか？

text-shadow プロパティは、Chrome、Firefox、Safari、Edge、Opera を含むすべてのモダンブラウザでサポートされています。

---
Interactive version: https://toollantern.win/ja/css-text-shadow-generator/