You can control the rounded corners by using the property border-radius. You can set a single radius to make circular corners, or two radii to make elliptical corners. border-radius:(value) 0 0 (value)/(value) 0 0 (value) or use this

border-top-left-radius:(value-1) (value-2);

border-bottom-left-radius:(value-1) (value-2);

this will set a different border radius on each side of the corner try some values till you reach your shape.

about the gradient I think you will need to make an element above you picture and set a gradient to it with an opacity of color