Color Detection

Overview

The Color Detection Model is useful to extract the dominant and most relevant colors within an image.

Use cases

• Create a visually appealing design, by automatically adapting font colors, borders or other items to image colors
• Select images that have certain color properties
• Group or classify images by color

Principles

The objective of the Color Detection Model is to list the most important colors within an image. Those include 3 types of colors: the dominant color, the accent colors, and the secondary colors.

Dominant color

The dominant color is the color that would be perceived as being the dominant one in an image by a human viewer. This takes into account:

• the area covered by the color
• the way this area is distributed in the image
• the "intensity" of the color as perceived by humans

For instance highly saturated colors, or colors close to red / yellow / orange will stand out more than duller colors. This is accounted for in the color detection.

Dominant color:

#7693be

Accent colors

Accent colors are colors that are not dominant in the image, that sometimes occupy a small area of the image, but that still draw the human eye's due to their intensity, contrast or saturation.

In this image, the boy's red tee-shirt is small in area but has an impactful color. Accent colors are:

	#cb2318
	#1c8780
	#105b84

Secondary colors

Secondary colors are colors that are important in the image but that are neither the dominant one nor accent colors.

Secondary colors:

	#304651
	#864039
	#6c978a
	#887745
	#a28a68

Use the model

If you haven't already, create an account to get your own API keys. You should then install the SDK that corresponds to your programming language. You can also implement your own logic to interact with our API if you prefer. Have a look at our API documentation for more details.

Detect the properties of an image

Let's say you want to moderate the following image:

You can either upload a public URL to the image, or upload the raw binary image. Here's how to proceed if you choose to share the image's public URL:

curl -X GET -G 'https://api.sightengine.com/1.0/check.json' \
    -d 'models=properties' \
    -d 'api_user={api_user}&api_secret={api_secret}' \
    --data-urlencode 'url=https://sightengine.com/assets/img/examples/example-prop-c1.jpg'

# this example uses requests
import requests
import json

params = {
  'url': 'https://sightengine.com/assets/img/examples/example-prop-c1.jpg',
  'models': 'properties',
  'api_user': '{api_user}',
  'api_secret': '{api_secret}'
}
r = requests.get('https://api.sightengine.com/1.0/check.json', params=params)

output = json.loads(r.text)

$params = array(
  'url' =>  'https://sightengine.com/assets/img/examples/example-prop-c1.jpg',
  'models' => 'properties',
  'api_user' => '{api_user}',
  'api_secret' => '{api_secret}',
);

// this example uses cURL
$ch = curl_init('https://api.sightengine.com/1.0/check.json?'.http_build_query($params));
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
$response = curl_exec($ch);
curl_close($ch);

$output = json_decode($response, true);

// this example uses axios
const axios = require('axios');

axios.get('https://api.sightengine.com/1.0/check.json', {
  params: {
    'url': 'https://sightengine.com/assets/img/examples/example-prop-c1.jpg',
    'models': 'properties',
    'api_user': '{api_user}',
    'api_secret': '{api_secret}',
  }
})
.then(function (response) {
  // on success: handle response
  console.log(response.data);
})
.catch(function (error) {
  // handle error
  if (error.response) console.log(error.response.data);
  else console.log(error.message);
});

The API will then return a JSON response:

                
                
{
    "status": "success",
    "request": {
        "id": "req_0zrbHDeitGYY7wEGncAne",
        "timestamp": 1491402308.4762,
        "operations": 0
    },
    "sharpness": 0.995,
    "contrast": 0.886,
    "brightness": 0.522,
    "colors": {
        "dominant": {
            "r": 135,
            "g": 127,
            "b": 84,
            "hex": "#877f54"
        },
        "accent": [
            {
                "r": 163,
                "g": 149,
                "b": 41,
                "hex": "#a39529"
            },
            {
                "r": 119,
                "g": 127,
                "b": 32,
                "hex": "#777f20"
            }
        ],
        "other": [
            {
                "r": 50,
                "g": 48,
                "b": 20,
                "hex": "#323014"
            },
            {
                "r": 232,
                "g": 222,
                "b": 204,
                "hex": "#e8decc"
            },
            {
                "r": 218,
                "g": 198,
                "b": 145,
                "hex": "#dac691"
            },
            {
                "r": 84,
                "g": 62,
                "b": 25,
                "hex": "#543e19"
            }
        ]
    },
    "media": {
        "id": "med_0zrbk8nlp4vwI5WxIqQ4u",
        "uri": "https://sightengine.com/assets/img/examples/example-prop-c1.jpg"
    }
}
                
            

Any other needs?

See our full list of Image/Video models for details on other filters and checks you can run on your images and videos. You might also want to check our Text models to moderate text-based content: messages, reviews, comments, usernames...