Cloudinary Blog

How-to automatically identify similar images using pHash

How-to automatically identify similar images using pHash

Photos today can be easily edited by means of resizing, cropping, adjusting the contrast, or changing an image’s format. As a result, new images are created that are similar to the original ones. Websites, web applications and mobile apps that allow user generated content uploads can benefit from identifying similar images.

Image de-duplication

If your site allows users to upload images, they can also upload various processed or manipulated versions of the same image. As described above, while the versions are not exactly identical, they are quite similar.

Obviously, it’s good practice to show several different images on a single page and avoid displaying similar images. For example, travel sites might want to show different images of a hotel room, but avoid having similar images of the room on the same page.

Additionally, if your web application deals with many uploaded images, you may want to be able to automatically recognize if newly uploaded images are similar to previously uploaded images. Recognizing similar images can prevent duplicate images from being used once they are uploaded, allowing you to better organize your site’s content.

Image similarity identification

Cloudinary uses perceptual hash (pHash), which acts as an image’s fingerprint. This mathematical algorithm analyzes an image's content and represents it using a 64-bit number fingerprint. Two images’ pHash values are "close" to one another if the images’ content features are similar. By comparing two images’ fingerprints, you can tell if they are similar.

You can request the pHash value of an image from Cloudinary for any uploaded image, either using Cloudinary's upload API, or for any previously uploaded image in your media library using our admin API. You can simply set the phash parameter to true, which produces the image's pHash value.

Using the following image for example:

Original koala photo

Below is a code sample in Ruby that shows how to upload this image with a request for the pHash value:

Cloudinary::Uploader.upload("koala1.jpg", :public_id => "koala1", :phash => true)

The result below shows the returned response with the calculated pHash value:

    {
     "public_id": "koala1",
     "version": 1424266415,
     "width": 887,
     "height": 562,
     "format": "jpg",
     "etag": "6f821ea4478af3e3a183721c0755cb1b",
    ...
     "phash": "ba19c8ab5fa05a59"
    }

The examples below demonstrate multiple similar images and their pHash values. Let's compare the pHash values and find the distance between each pair. If you XOR two of the pHash values and count the “1’s” in the result, you get a value between 0-64. The lower the value, the more similar the images are. If all 64 bits are the same, the photos are very similar.

The similarity score of the examples below expresses how each image is similar to the original image. The score is calculated as 1 - (phash_distance(phash1, phash2) / 64.0) in order to give a result between 0.5 and 1 (phash_distance can be computed using bit_count(phash1 ^ phash2) in MySQL for example).

Original koala thumbnail
887x562 JPEG, 180 KB
pHash: ba19c8ab5fa05a59

Grayscale koala
887x562 JPEG, 149 KB
Difference: grayscale.
pHash: ba19caab5f205a59
Similarity score: 0.96875

Cropped koala photo with increased saturation
797x562 JPEG, 179 KB
Difference: cropped, increased color saturation.
pHash: ba3dcfabbc004a49
Similarity score: 0.78125

Cropped koala photo with lower JPEG quality
887x509 JPEG, 30.6 KB
Difference: cropped, lower JPEG quality.
pHash: 1b39ccea7d304a59
Similarity score: 0.8125

Another koala photo
1000x667 JPEG, 608 KB
Difference: a different koala photo...
pHash: 3d419c23c42eb3db
Similarity score: 0.5625

Not a koala photo
1000x688 JPEG, 569 KB
Difference: not a koala...
pHash: f10773f1cd269246
Similarity score: 0.5

As you can see from the results above that the three images that appear to be similar to the original received a high score when they were compared. While other comparison results showed significantly less similarity.

By using Cloudinary to upload users’ photos to your site or application, you can request the pHash values of the uploaded images and store them on your servers. That allows you to identify which images are similar and decide what the next step should be. You may want to keep similar images, classify them in your database, filter them out, or interactively allow users to decide which images they want to keep.

Summary

This feature is available for any Cloudinary plan, including the free tier. As explained above, you can use Cloudinary’s API to get an image’s fingerprint and start checking for similarities. In addition, it is in our roadmap to further enhance our similar image search and de-duplication capabilities.

Recent Blog Posts

How the Right Tools and Training Drive SDR Success

Here at Cloudinary, I head a team of eight SDRs, who are responsible for creating the first impression potential customers have of our company’s brand. In just the first 10 months of 2017, our team of outbound SDRs have been responsible for sending more than 67,000 personalized emails and making more than 15,000 calls.

Read more
The JS video player that developers will love (How To)

It doesn't take a genius (or a statistician) to know that video represents a significant proportion of web and mobile content these days. But did you realize that in 2017, video will account for about 75% of all internet traffic and that 55% of people watch videos online every day? In fact, 52% of marketing professionals worldwide believe that video is the content type with the best ROI, with people spending up to 2.6x more time on pages with video than on those without.

Read more
 Beyond Drupal Media: Make Images and Video Fly with Cloudinary

Drupal is a very popular open source content management system (CMS) that has been deployed countless times by organizations and developers around the world. Drupal gained a reputation for being very flexible, powerful and robust in creating complex websites. With Drupal, you can create everything from plain websites, blogs and forums to ambitious enterprise systems.

Read more
Curbing Terrorist Content Online

Today, Cloudinary is proud to announce that it has joined The Global Internet Forum to Counter Terrorism (GIFCT), to help fight the spread of terrorist and violent extremist content on the Internet. The forum was established by Facebook, Microsoft, Twitter and YouTube in mid-2017. Cloudinary will contribute to the hash-sharing database, which all contributing companies can use to help identify and block terrorist related images and videos upon upload.

Read more
Introducing the complete video solution for developers

Videos in web sites and apps are starting to catch up with images in terms of popularity and they are a constantly growing part of the media strategy for most organizations. This means bigger challenges for developers who need to handle these videos in their web sites and mobile apps. Cloudinary's mission is to solve all developer needs around image and video management. In this blog post, we are excited to introduce Cloudinary's complete cloud-based video management solution for developers.

Read more
Getting Started with StencilJS

Stencil is basically a compiler, not necessarily a UI library. A compiler that transforms TSX (TypeScript + JSX) into self-contained custom components.

Before you start learning about the tool, it’s important to note that Stencil is not another heavy JavaScript framework you need to learn. If you have worked with Angular or React, or understand web components, then Stencil is worth a look.

Read more