<svg> にwidth, height属性が付いていないために横幅が親要素の100%になってしまう蟹

viewBoxは "0 0 36 36" と指定されている

この情報を用いて正方形で表示したいところ

https://cdnjs.cloudflare.com/ajax/libs/twemoji/14.0.2/svg/1f980.svg より

クリックしてmodalで表示すると極小サイズで描画される

<svg> にwidth, heightが付与された蟹

等身大 (viewBoxで指定されたサイズ) の蟹

アスペクト比を保ちつつ横幅を200pxにした蟹

他の例

仕様

?svg=srcUrl

<svg> に書かれたviewBox属性の値をそのまま使う

/

片辺のピクセル数を与えてアスペクト比を保って拡縮する

/w/100

/h/100

GitHub

Vercel app