color

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2015年7月⁩.

color 属性は、間接的な値の候補である currentcolor を fill, stroke, stop-color, flood-color, lighting-color の各属性に与えるために使用します。

メモ: プレゼンテーション属性として、color は CSS プロパティとして使用できます。詳しい情報は CSS 色を参照してください。

プレゼンテーション属性として、任意の要素に適用することができますが、上記のように SVG 要素には直接影響を与えません。

使用上のメモ

値	`<color>` \| `inherit`
既定値	ユーザーエージェントによる
アニメーション	可

例

html,
body,
svg {
  height: 100%;
}

html

<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <g color="green">
    <rect width="50" height="50" fill="currentcolor" />
    <circle
      r="25"
      cx="70"
      cy="70"
      stroke="currentcolor"
      fill="none"
      stroke-width="5" />
  </g>
</svg>