Как внизу блока сделать маску волной и поместить туда изображение?
Нужно внизу блока (секции) создать маску в виде волны, в которой лежит изображение.
Примерно как на этой картинке:
Подробнее:
На сером фоне некий контент (фон не обязательно серый, выделил просто для наглядности), потом белая полоса (бордер пикселей 5), потом изображение, которое можно центрировать верх-низ, право-лево.
Надо посмотреть , какими слоями это реализовано в макете. Если картинка в формате png + маска в формате png , то их можно объединить в фигме и сохранить , как один слой. А потом добавить и через z-index поднять выше верхнего слоя Но это все приблизительно, так как сложно судить по картинке, не видя макета
У тебя на кратинке не "бордер пикселей 5" а весьма неравномерный нарисованный контур.
Если он - часть картинки, то просто делаешь из картинки PNG с прозрачностью и всё.
Иначе в CSS есть свойство mask - делаешь пару масок - одну на контур, одну на картинку под ним, или совмещаешь с clip-path.
Вот так можно обойтись одной маской, если использовать оба варианта наложения:
Простой
