EverWeb Widgets HTML5

Image Crop

Image Crop Widget

Rectangular Crop

This widget will crop out a square or rectangle from an image using pure CSS. The corners can be rounded and a box shadow added if required.
NOTE that, although the area of the image in view is reduced, the file size is not.

Rectangle Image Crop
image crop widget

Original Image

Cropped Image

icon button widget

Widget Settings

Choose the image from the Asssets List and enter alt text for SEO.
Set the widget width and height to the required cropped size using the drag handles or the Metrics inspector.
Adjust the Horizontal and Vertical sliders to bring the required portion of the image into view.
Set the corner radius if required.
Set the box shadow color and radius if required.

Get The Widget