Clip images into shapes using CSS border-radius and object-fit.

Original

Circle

Arch

Pill

Rotation — CSS transform

A slight tilt using CSS transform: rotate(). The surrounding space is preserved with margin.

Rotation — SVG attribute (no CSS)

The same tilt using an SVG transform presentation attribute — no stylesheet or inline style involved. The rotate(angle, cx, cy) values set the angle and centre point of rotation.

Rotation — diamond (45°)