SVGのオフセットカラーを変更する方法


  1. CSSを使用する方法: SVG要素に対してCSSを使用してオフセットカラーを変更することができます。例えば、次のようなスタイルを適用することで、オフセットカラーを赤色に変更することができます。
svg {
  filter: drop-shadow(0 0 10px red);
}
  1. JavaScriptを使用する方法: JavaScriptを使用してSVGのオフセットカラーを変更することもできます。以下のコードは、JavaScriptを使ってSVG要素のオフセットカラーを青色に変更する例です。
var svgElement = document.querySelector('svg'); // SVG要素を取得
svgElement.style.filter = 'drop-shadow(0 0 10px blue)'; // オフセットカラーを青色に変更
  1. SVG要素の属性を変更する方法: SVG要素の属性を直接変更することで、オフセットカラーを変更することもできます。以下のコードは、SVG要素のfilter属性を変更してオフセットカラーを緑色にする例です。
var svgElement = document.querySelector('svg'); // SVG要素を取得
svgElement.setAttribute('filter', 'drop-shadow(0 0 10px green)'); // オフセットカラーを緑色に変更

これらはSVGのオフセットカラーを変更するための一般的な方法のいくつかです。あなたの使用環境や要件に応じて、適切な方法を選択してください。