CSS text-shadowジェネレーター

ジェネレーターの仕組み

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

構文の理解

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

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

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

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

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