トリミングも影つけもCSSでやっちゃえ

cssで画像のトリミングも影もつけれるなんて～
WEBの事学んでて、今はペライチのカフェサイトコーディング勉強中です

影も水平、垂直、ぼかしに色と
ちょっとした画像ならPhotoshopに頼らずにCSSでいけるじゃん
自動化でもっと楽にいろんなこと出来るんじゃないかと
妄想膨らませています

まずは画像のトリミング　cssでも出来るとは知らなかった

https://fastcoding.jp/blog/all/info/object-fit/

【CSS】CSSだけで画像をトリミングできる「object-fit」 | FASTCODING BLOG

https://webst8.com/blog/css-object-fit/

【CSS object-fitの使い方】CSSで画像トリミングする方法

そして影のことも
https://designerbrg.com/box_shadow_filter/

「box-shadow」と「filter: drop-shadow」の書き方と注意点[CSS] - デザイナーブリッジ

https://ics.media/entry/200406/

box-shadowだけじゃない！CSSでできる色々な影の表現と意外に知らない落とし穴 - ICS MEDIA - ICS MEDIA

ただサファリではおかしくなるのかな？
自分の目で試してないのでわかりませんが、そう書かれてあるサイトが複数あるので、いずれ機会あったら確認してみたいです
https://comment-out.net/2022/04/20/1114.html

【CSS】box-shadowよりもfilter: drop-shadowがオススメ | CommentOut

https://zenn.dev/kibe/articles/659dadd1d6426c

【CSS】Safariでfilter: drop-shadowが崩れる