{"id":21368,"date":"2016-04-14T12:14:35","date_gmt":"2016-04-14T12:14:35","guid":{"rendered":"http:\/\/facial_attribute_detection_with_microsoft_s_face_api"},"modified":"2025-03-23T12:25:53","modified_gmt":"2025-03-23T19:25:53","slug":"facial_attribute_detection_with_microsoft_s_face_api","status":"publish","type":"post","link":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api","title":{"rendered":"Facial Attribute Detection with Microsoft’s Face API and Cloudinary"},"content":{"rendered":"

Many of the photos displayed on the internet these days are of people. If your website or mobile application displays photos that include people, you will want to make sure that their faces are included in the delivered images when cropping and transforming them to fit your graphic design and responsive layout. You may even want to further transform an image according to the faces present, for example, adding a harlequin mask overlay on all of their eyes, where each mask is adjusted to the correct size and orientation (although not a typical use case, it\u2019s a cool example of using advanced facial attribute detection):<\/p>\n

\n Loading code examples<\/span>\n <\/cld-code-widget>\"Cloudinary<\/a><\/p>\n

Face Detection is a great feature that enables the automatic modification of images according to the detected faces within an image, making it simple to intelligently crop, position, resize and transform your images appropriately.<\/p>\n

At Cloudinary we strive to create an enriched environment that can solve our customers media asset related needs. By taking a holistic approach to image management, we create partnerships with leading companies developing image processing and media related technologies that can extend our internal features and capabilities and cater customers with more \u201ccomplex\u201d needs. Our add-ons feature services pre-integrated into Cloudinary that are tailored for developing, extending, and operating web and mobile apps.<\/p>\n

We have recently partnered with Microsoft\u2019s Cognitive Services<\/a><\/strong> which provides a Face API<\/a><\/strong> for high precision face detection with state-of-the-art cloud-based algorithms. The Face API technology is fully integrated within our Advanced Facial Attributes Detection<\/strong> add-on that can do more than just detect the human faces in an image. The Advanced Facial Attribute Detection add-on can also extract meaningful advanced data about the face(s) in an image, including the exact location of facial features. This allows you even greater control over your image categorization, and to automatically use these details to smartly crop, position, rotate and overlay images based on the detected facial features.<\/p>\n

\"Microsoft<\/a><\/p>\n

How to automatically detect facial attributes<\/h2>\n

Cloudinary supports uploading images using a cloud-based API. You can request further information while uploading the image by setting the detection<\/code> parameter to adv_face<\/code> when calling Cloudinary\u2019s upload API and Advanced Facial Attribute Detection is utilized to automatically extract detailed face attributes from the uploaded image. The detected faces are returned in the JSON response with rectangles (left, top, width and height) indicating the location of faces in the image in pixels, the exact position details of the eyes, mouth, eyebrows, nose and lips, as well as a series of face related attributes from each face such as pose, gender and age. See the Advanced Facial Attribute Detection documentation<\/a> for more information. The code sample below uploads the lady<\/code> image while requesting that the facial attributes are also returned in the JSON response:<\/p>\n\n Loading code examples<\/span>\n <\/cld-code-widget>\n

\n Loading code examples<\/span>\n <\/cld-code-widget>\"Original<\/a><\/p>\n

The example JSON snippet below contains the results of the upload response when applying advanced facial attribute detection on the uploaded image. The response includes very detailed information regarding the face that was automatically detected in the image above:<\/p>\n

{\n...\n \"info\"<\/span>: \n  {\"detection\"<\/span>: \n    {\"adv_face\"<\/span>: \n      {\"status\"<\/span>: \"complete\"<\/span>,\n       \"data\"<\/span>: \n        [{\"bounding_box\"<\/span>: \n           {\"top\"<\/span>: 234.0<\/span>, \"left\"<\/span>: 216.0<\/span>, \"width\"<\/span>: 244.0<\/span>, \"height\"<\/span>: 244.0<\/span>},\n          \"attributes\"<\/span>: \n           {\"smile\"<\/span>: 0.649<\/span>,\n            \"head_pose\"<\/span>: {\"pitch\"<\/span>: 0.0<\/span>, \"roll\"<\/span>: -6.7<\/span>, \"yaw\"<\/span>: 0.6<\/span>},\n            \"gender\"<\/span>: \"female\"<\/span>,\n            \"age\"<\/span>: 30.3<\/span>,\n            \"facial_hair\"<\/span>: {\"moustache\"<\/span>: 0.0<\/span>, \"beard\"<\/span>: 0.0<\/span>, \n                            \"sideburns\"<\/span>: 0.0<\/span>}},\n          \"facial_landmarks\"<\/span>: \n           {\"mouth\"<\/span>: \n             {\"left\"<\/span>: {\"x\"<\/span>: 277.1<\/span>, \"y\"<\/span>: 410.6<\/span>},\n              \"right\"<\/span>: {\"x\"<\/span>: 410.2<\/span>, \"y\"<\/span>: 395.1<\/span>},\n              \"under_lip\"<\/span>: \n               {\"bottom\"<\/span>: {\"x\"<\/span>: 352.8<\/span>, \"y\"<\/span>: 445.0<\/span>},\n                \"top\"<\/span>: {\"x\"<\/span>: 349.1<\/span>, \"y\"<\/span>: 431.8<\/span>}},\n              \"upper_lip\"<\/span>: \n               {\"bottom\"<\/span>: {\"x\"<\/span>: 346.3<\/span>, \"y\"<\/span>: 415.1<\/span>},\n                \"top\"<\/span>: {\"x\"<\/span>: 345.4<\/span>, \"y\"<\/span>: 407.5<\/span>}}},\n            \"eyebrow\"<\/span>: \n             {\"left_outer\"<\/span>: {\"x\"<\/span>: 224.1<\/span>, \"y\"<\/span>: 298.0<\/span>},\n              \"left_inner\"<\/span>: {\"x\"<\/span>: 306.6<\/span>, \"y\"<\/span>: 283.4<\/span>},\n              \"right_inner\"<\/span>: {\"x\"<\/span>: 361.4<\/span>, \"y\"<\/span>: 279.8<\/span>},\n              \"right_outer\"<\/span>: {\"x\"<\/span>: 428.8<\/span>, \"y\"<\/span>: 272.2<\/span>}},\n            \"eye\"<\/span>: \n             {\"left_outer\"<\/span>: {\"x\"<\/span>: 258.5<\/span>, \"y\"<\/span>: 314.1<\/span>},\n              \"left_top\"<\/span>: {\"x\"<\/span>: 277.0<\/span>, \"y\"<\/span>: 306.2<\/span>},\n              \"left_bottom\"<\/span>: {\"x\"<\/span>: 277.1<\/span>, \"y\"<\/span>: 315.6<\/span>},\n              \"left_inner\"<\/span>: {\"x\"<\/span>: 296.4<\/span>, \"y\"<\/span>: 312.9<\/span>},\n              \"right_inner\"<\/span>: {\"x\"<\/span>: 373.4<\/span>, \"y\"<\/span>: 305.2<\/span>},\n              \"right_top\"<\/span>: {\"x\"<\/span>: 388.0<\/span>, \"y\"<\/span>: 294.5<\/span>},\n              \"right_bottom\"<\/span>: {\"x\"<\/span>: 389.0<\/span>, \"y\"<\/span>: 306.0<\/span>},\n              \"right_outer\"<\/span>: {\"x\"<\/span>: 406.5<\/span>, \"y\"<\/span>: 300.2<\/span>},\n              \"left_pupil\"<\/span>: {\"x\"<\/span>: 278.3<\/span>, \"y\"<\/span>: 309.4<\/span>},\n              \"right_pupil\"<\/span>: {\"x\"<\/span>: 386.0<\/span>, \"y\"<\/span>: 298.7<\/span>}},\n            \"nose\"<\/span>: \n             {\"tip\"<\/span>: {\"x\"<\/span>: 341.6<\/span>, \"y\"<\/span>: 381.6<\/span>},\n              \"root_left\"<\/span>: {\"x\"<\/span>: 321.9<\/span>, \"y\"<\/span>: 314.6<\/span>},\n              \"root_right\"<\/span>: {\"x\"<\/span>: 343.6<\/span>, \"y\"<\/span>: 311.8<\/span>},\n              \"left_alar_top\"<\/span>: {\"x\"<\/span>: 312.7<\/span>, \"y\"<\/span>: 359.7<\/span>},\n              \"right_alar_top\"<\/span>: {\"x\"<\/span>: 359.2<\/span>, \"y\"<\/span>: 351.2<\/span>},\n              \"left_alar_out_tip\"<\/span>: {\"x\"<\/span>: 305.4<\/span>, \"y\"<\/span>: 380.4<\/span>},\n              \"right_alar_out_tip\"<\/span>: {\"x\"<\/span>: 374.3<\/span>, \"y\"<\/span>: 367.5<\/span>}}}}]}}},\n}\n<\/code><\/span>Code language:<\/span> JavaScript<\/span> (<\/span>javascript<\/span>)<\/span><\/small><\/pre>\n
Summary<\/h2>\n
The Advanced Facial Attribute Detection add-on powered by Cloudinary and the Face API of Microsoft\u2019s Cognitive Services provides a high precision mechanism that can analyze images and create the best crop for most sites as well as automatically add the nice artistic effects of exact overlay placing. The integration within Cloudinary\u2019s pipeline is seamless and dynamic using simple transformation URLs.<\/p>\n
We are excited to enter into this partnership with Microsoft\u2019s Cognitive Services so give the add-on a try. The Advanced Facial Attribute Detection add-on<\/a> is available to all our free and paid plans.<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":41,"featured_media":23398,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_cloudinary_featured_overwrite":false,"footnotes":""},"categories":[1],"tags":[91,92,113,165,176,183,214,229,257],"class_list":["post-21368","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","tag-django","tag-dotnet","tag-face-detection","tag-image-transformation","tag-java","tag-jquery","tag-node","tag-php","tag-ruby-on-rails"],"acf":[],"yoast_head":"\nFacial Attribute Detection with Microsoft's Face API<\/title>\n<meta name=\"description\" content=\"How to extract detailed facial attributes from images, enabling categorization and overlay using Cloudinary and Microsoft's Face API.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Facial Attribute Detection with Microsoft's Face API and Cloudinary\" \/>\n<meta property=\"og:description\" content=\"How to extract detailed facial attributes from images, enabling categorization and overlay using Cloudinary and Microsoft's Face API.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api\" \/>\n<meta property=\"og:site_name\" content=\"Cloudinary Blog\" \/>\n<meta property=\"article:published_time\" content=\"2016-04-14T12:14:35+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-03-23T19:25:53+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection-jpg?_i=AA\" \/>\n\t<meta property=\"og:image:width\" content=\"2000\" \/>\n\t<meta property=\"og:image:height\" content=\"1100\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"NewsArticle\",\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#article\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api\"},\"author\":{\"name\":\"\",\"@id\":\"\"},\"headline\":\"Facial Attribute Detection with Microsoft’s Face API and Cloudinary\",\"datePublished\":\"2016-04-14T12:14:35+00:00\",\"dateModified\":\"2025-03-23T19:25:53+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api\"},\"wordCount\":10,\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection.jpg?_i=AA\",\"keywords\":[\"Django\",\"DotNet\",\"Face Detection\",\"Image Transformation\",\"Java\",\"jQuery\",\"Node\",\"PHP\",\"Ruby on Rails\"],\"inLanguage\":\"en-US\",\"copyrightYear\":\"2016\",\"copyrightHolder\":{\"@id\":\"https:\/\/cloudinary.com\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api\",\"url\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api\",\"name\":\"Facial Attribute Detection with Microsoft's Face API\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#primaryimage\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection.jpg?_i=AA\",\"datePublished\":\"2016-04-14T12:14:35+00:00\",\"dateModified\":\"2025-03-23T19:25:53+00:00\",\"description\":\"How to extract detailed facial attributes from images, enabling categorization and overlay using Cloudinary and Microsoft's Face API.\",\"breadcrumb\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#primaryimage\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection.jpg?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection.jpg?_i=AA\",\"width\":2000,\"height\":1100},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/cloudinary.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Facial Attribute Detection with Microsoft’s Face API and Cloudinary\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\",\"url\":\"https:\/\/cloudinary.com\/blog\/\",\"name\":\"Cloudinary Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/cloudinary.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\",\"name\":\"Cloudinary Blog\",\"url\":\"https:\/\/cloudinary.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA\",\"width\":312,\"height\":60,\"caption\":\"Cloudinary Blog\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Facial Attribute Detection with Microsoft's Face API","description":"How to extract detailed facial attributes from images, enabling categorization and overlay using Cloudinary and Microsoft's Face API.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api","og_locale":"en_US","og_type":"article","og_title":"Facial Attribute Detection with Microsoft's Face API and Cloudinary","og_description":"How to extract detailed facial attributes from images, enabling categorization and overlay using Cloudinary and Microsoft's Face API.","og_url":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api","og_site_name":"Cloudinary Blog","article_published_time":"2016-04-14T12:14:35+00:00","article_modified_time":"2025-03-23T19:25:53+00:00","og_image":[{"width":2000,"height":1100,"url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection-jpg?_i=AA","type":"image\/jpeg"}],"twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"NewsArticle","@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#article","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api"},"author":{"name":"","@id":""},"headline":"Facial Attribute Detection with Microsoft’s Face API and Cloudinary","datePublished":"2016-04-14T12:14:35+00:00","dateModified":"2025-03-23T19:25:53+00:00","mainEntityOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api"},"wordCount":10,"publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection.jpg?_i=AA","keywords":["Django","DotNet","Face Detection","Image Transformation","Java","jQuery","Node","PHP","Ruby on Rails"],"inLanguage":"en-US","copyrightYear":"2016","copyrightHolder":{"@id":"https:\/\/cloudinary.com\/#organization"}},{"@type":"WebPage","@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api","url":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api","name":"Facial Attribute Detection with Microsoft's Face API","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#primaryimage"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection.jpg?_i=AA","datePublished":"2016-04-14T12:14:35+00:00","dateModified":"2025-03-23T19:25:53+00:00","description":"How to extract detailed facial attributes from images, enabling categorization and overlay using Cloudinary and Microsoft's Face API.","breadcrumb":{"@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#primaryimage","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection.jpg?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection.jpg?_i=AA","width":2000,"height":1100},{"@type":"BreadcrumbList","@id":"https:\/\/cloudinary.com\/blog\/facial_attribute_detection_with_microsoft_s_face_api#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cloudinary.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Facial Attribute Detection with Microsoft’s Face API and Cloudinary"}]},{"@type":"WebSite","@id":"https:\/\/cloudinary.com\/blog\/#website","url":"https:\/\/cloudinary.com\/blog\/","name":"Cloudinary Blog","description":"","publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cloudinary.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/cloudinary.com\/blog\/#organization","name":"Cloudinary Blog","url":"https:\/\/cloudinary.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA","width":312,"height":60,"caption":"Cloudinary Blog"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":""}]}},"jetpack_featured_media_url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647048349\/59_facial_attribute_detection\/59_facial_attribute_detection.jpg?_i=AA","_links":{"self":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21368","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/users\/41"}],"replies":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/comments?post=21368"}],"version-history":[{"count":3,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21368\/revisions"}],"predecessor-version":[{"id":37247,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21368\/revisions\/37247"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media\/23398"}],"wp:attachment":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media?parent=21368"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/categories?post=21368"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/tags?post=21368"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Dynamic image transformation with facial attribute detection<\/h2>\n
Cloudinary supports on-the-fly image transformation using simple parameters in HTTP delivery URLs. Based on the position of facial attributes detected by the Advanced Facial Attribute Detection add-on, Cloudinary can crop your images to focus on the detected facial features, while providing a large set of image transformation<\/a> and cropping options when using a Cloudinary delivery URL. To focus an automatic crop on the detected faces, simply set the crop<\/code> parameter to thumb<\/code>, fill<\/code> or crop<\/code> and the gravity<\/code> parameter to adv_faces<\/code> (set gravity<\/code> to adv_face<\/code> for focusing on the single largest detected face in the image). The resulting images are dynamically generated on-the-fly and the result is delivered via a fast CDN.<\/p>\n
For example, to deliver a 300×300 thumbnail of the lady<\/code> image shown above:<\/p>\n
\n      Loading code examples<\/span>\n    <\/cld-code-widget>\"150x150<\/a><\/p>\n
Cloudinary can also dynamically crop your images based on the position of detected eyes. Simply set the gravity<\/code> parameter to adv_eyes<\/code> (g_adv_eyes<\/code> for URLs) to center the image on the detected eyes. The example below delivers a 200×60 thumbnail centered on the eyes:<\/p>\n
\n      Loading code examples<\/span>\n    <\/cld-code-widget>\"200x60<\/a><\/p>\n
Thanks to the detailed information on the position of facial attributes detected by the Advanced Facial Attribute Detection add-on, Cloudinary can add overlays while taking into account the pose of the face, and automatically scale and rotate the overlay accordingly.<\/p>\n
\n      Loading code examples<\/span>\n    <\/cld-code-widget>\"Harlequin<\/a><\/p>\n
For example, in order to automatically overlay the above image of a harlequin mask scaled to 170% relative to the detected eyes in the main image:<\/p>\n
\n      Loading code examples<\/span>\n    <\/cld-code-widget>\"Harlequin<\/a><\/p>\n
See the Advanced Facial Attribute Detection documentation<\/a> for more information on the features available with the add-on and how to use them.<\/p>\n