CSSで画像の周りをぼかすには?

ショコラ
ショコラ

CSSで画像の周りをぼかすには?

サンプルを掲載します。

もっさん先輩
もっさん先輩

↓こんな風に画像の周りを少しぼかして尖がった角を表示させない感じにできます。

<html>
<body>
<style>
.img-container
{
  position: relative;
  width:300px;
}
.img-container::after
{
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  box-shadow: inset 0 0 2px 2px #FFF;
}
</style>
<div class="img-container">
  <img src="https://answorz.com/wp-content/uploads/2023/03/Screenshot_20230325_085823-640.png" style="width:100%; aspect-ratio:100/100; object-fit:cover;">
</div>
</body>
</html>

以上

Scroll to Top