背景色の上に画像を乗せる方法

Question

https://gyazo.com/21c9a73b2a3cdccc8dbbb782059ec474

元々の画像は白色の長方形なのですが、円のオレンジ色を画像の背景に設定するにはどうすればいいのでしょうか？

Comments

[m.ts10806]

現状が再現するコードを提示してください。
あと画像は外部サイトではなくteratailの投稿機能を利用してください。

また、自身で試したこと調べたことを記載してください

Answer 1

円のオレンジ色を画像の背景に設定する

こういうことですか？
サンプルを置いておきます。
https://jsfiddle.net/Lhankor_Mhy/ao7nsw63/

img{
  width: 500px;
  height: 500px;
  object-fit: none;
  background-image: radial-gradient(orange 0% 50%, transparent 50%);
}

Answer 2

解決いたしました！
ありがとうございます。

Comments

[kei344]

【質問をした後に自己解決してしまった --- ヘルプ｜teratail（テラテイル）】
https://teratail.com/help#resolve-myself
> 後から読む人のためにも、具体的な解決手順を記載してください。