Crop A Photo To Passport Size On Webflow

We use CropGuide to crop a photo to Passport size before users upload photos on Webflow

First we need to install CropGuide for Webflow. Then we can set up Passport cropping. This will only take a couple minutes.

If you’re unfamiliar with CropGuide you can try it out on the site

Set the Passport aspect ratio

We can set the correct Passport aspect ratio in the CropGuide customer dashboard, this will make sure your customers always upload correctly sized images.

  1. Select your website in the Customer dashboard.
  2. Scroll towards the Configuration heading.
  3. Then find Crop Aspect Ratio heading just below it. A screenshot of the CropGuide dashboard showing a text input to set a custom crop aspect ratio
  4. Now we enter 125:88 as the aspect ratio, which is the Passport size in millimeters.
  5. Click save.

If you want to make sure images are of high enough quality you can optionally set the Minimum Crop Size field.

Now go to the form on your website, refresh the page so we’re sure our new settings have loaded.

Test your Passport cropping field

When using the image upload field on your Webflow website, CropGuide will now ensure every image is cropped to match the Passport aspect ratio of 125:88.

Your customers can now correctly cropped and rotated upload pictures of their Passport saving you time having to crop the documents manually.

Try a CropGuide demo on the site, or reach out if you have any questions.

Related content