.masked-image { width: 300px; height: 300px; background-image: url('photo.jpg'); background-size: cover; /* ماسک */ -webkit-mask-image: url('mask-shape.png'); mask-image: url('mask-shape.png'); -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; }