Как сделать чтобы фото обрезалось вот так?

Question

[mozhno]

По дизайну есть вот такая картинка, но нужно сделать так чтобы в дальнейшем пользователь мог сам её менять, поэтому она должна задаваться отдельно в нормальном виде и уже в вёрстке бы урезалась вот так. Можно ли это как-то кодом сделать если есть отдельно фигура для этого?

Answer 1

[Сергей delphinpro]

маску наложить на картинку и все.
можно по старинке - прозрачная пнг
можно нормально сделать - svg/css маски
https://developer.mozilla.org/en-US/docs/Web/CSS/mask
Основные принципы маскирования в CSS

Answer 2

[Kentavr16]

статья и полезный ресурс-инструмент