{"id":21921,"date":"2022-02-26T12:10:00","date_gmt":"2022-02-26T20:10:00","guid":{"rendered":"http:\/\/green_screen_queen_dynamic_video_transparency_fit_for_royalty"},"modified":"2025-11-01T06:14:46","modified_gmt":"2025-11-01T13:14:46","slug":"green_screen_queen_dynamic_video_transparency_fit_for_royalty","status":"publish","type":"post","link":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty","title":{"rendered":"Green Screen Queen: Dynamic Video Transparency Fit For Royalty"},"content":{"rendered":"<div class=\"wp-block-cloudinary-markdown \"><p>If you were reading your social media or news feeds on or around June 11 this year, no doubt you came across your fair share of posts about Queen Elizabeth and her outfit-color faux pas. For her 90th birthday, she chose a solid neon green suit, and it didn\u2019t take long for Photoshop fanatics to suggest alternative designs for the Queen\u2019s green-screen threads.<\/p>\n<p>Interestingly, this wasn\u2019t the only time Her Majesty embraced the green screen effect with her wardrobe. Back in June 2016, the Queen wore a bold, neon green outfit that immediately became a meme on the internet. Photoshop enthusiasts were quick to respond with creative and hilarious photo edits of the queen\u2019s outfit, showcasing the playful interaction between royal fashion and modern technology.<\/p>\n<p>In April 2020, during a historic speech, the Queen again donned a green dress. This choice promptly set the internet abuzz, as royal fans transformed this appearance into a series of entertaining memes. These instances, alongside her frequent choice of green attire for birthdays, underscore a recurring theme. As explained by the Countess of Wessex in the documentary \u201cThe Queen at 90,\u201d this vibrant lime green is often chosen to help people spot her in crowds, inadvertently making it ideal for green screen creativity.<\/p>\n<p>Replacing her green suit with the <a href=\"https:\/\/en.wikipedia.org\/wiki\/The_dress\">famous blue or white dress<\/a> is just one of <a href=\"https:\/\/www.boredpanda.com\/queen-elizabeth-green-screen-outfit-funny-photoshop-battle\/?utm_source=google&amp;utm_medium=organic&amp;utm_campaign=organic\">many examples<\/a>:<\/p>\n<p><a class=\"c-image-link\" href=\"https:\/\/res.cloudinary.com\/demo\/image\/fetch\/w_500,f_auto,q_auto,dpr_2\/https:\/\/static.boredpanda.com\/blog\/wp-content\/uploads\/2016\/06\/queen-elizabeth-green-screen-outfit-funny-photoshop-battle-13-575eb00d67cca__700.jpg\" target=\"_blank\"><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/fetch\/w_500,f_auto,q_auto,dpr_2\/https:\/\/static.boredpanda.com\/blog\/wp-content\/uploads\/2016\/06\/queen-elizabeth-green-screen-outfit-funny-photoshop-battle-13-575eb00d67cca__700.jpg\" alt=\"Queen in blue and white dress via green screen effect\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"500\" height=\"388\"\/><\/a><\/p>\n<center><small><i>From: boredpanda.com<\/i><\/small><\/center>\n<p><a href=\"https:\/\/cloudinary.com\">Cloudinary<\/a> is loved by developers for, among other things, its huge collections of on-the-fly programmatic image and video transformation options. Automatically generating an <strong>image<\/strong> that replaced the Queen\u2019s greens with an alternative design using Cloudinary image transformations would be no challenge.<\/p>\n<p>But we wanted a challenge. So in honor of the Queen, Cloudinary now supports its <code>make_transparent <\/code> parameter also <strong>for <a href=\"https:\/\/cloudinary.com\/video_api\">video<\/a><\/strong>!<\/p>\n<p>Given that in video, the color you want to make transparent is usually a moving target, this involves a more sophisticated algorithm for us, but it\u2019s still just one on-the-fly transformation away for you.<\/p>\n<p>For example, look what you get if you place the Queen\u2019s Coach Ride video as an overlay over a nice animated hearts video, and then apply the new dynamic video transparency parameter (<code>make_transparent<\/code>) to the Queen\u2019s green (hex color <code>#87ff66<\/code>) suit. You guessed it\u2026 <strong>A Queen of Hearts<\/strong>!<\/p>\n<video style=\"margin: 0 auto;display: block\" controls=\"controls\" preload=\"none\" muted  width=600 poster=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/q_auto,f_auto\/docs\/queen_of_hearts_poster.jpg\">\n  <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/du_15,so_12\/l_video:docs:green_screen_queen,e_make_transparent:15,co_rgb:87ff66,fl_relative,w_1.0\/docs\/animated_hearts.webm\" type=\"video\/webm\">\n  <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/du_15,so_12\/l_video:docs:green_screen_queen,e_make_transparent:15,co_rgb:87ff66,fl_relative,w_1.0\/docs\/animated_hearts.mp4\" type=\"video\/mp4\">\n  <source src=https:\/\/res.cloudinary.com\/demo\/video\/upload\/du_15,so_12\/l_video:docs:green_screen_queen,e_make_transparent:15,co_rgb:87ff66,fl_relative,w_1.0\/docs\/animated_hearts.ogv\" type=\"video\/ogg\">\n<\/video>\n<p>Here\u2019s what the URL for this video looks like, or click your favorite language to see how you would generate the URL in your web or mobile app using one of our many SDKs:<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;docs\\\/animated_hearts\\&quot;, {transformation: [ {width: 800, crop: \\&quot;scale\\&quot;}, {duration: \\&quot;15\\&quot;, start_offset: \\&quot;12\\&quot;}, {overlay: \\&quot;video:docs:green_screen_queen\\&quot;, effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#87ff66\\&quot;, flags: \\&quot;relative\\&quot;, width: \\&quot;1.0\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;docs\\\/animated_hearts\\&quot;, {transformation: [\\n  {width: 800, crop: \\&quot;scale\\&quot;},\\n  {duration: \\&quot;15\\&quot;, start_offset: \\&quot;12\\&quot;},\\n  {overlay: \\&quot;video:docs:green_screen_queen\\&quot;, effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#87ff66\\&quot;, flags: \\&quot;relative\\&quot;, width: \\&quot;1.0\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;docs\\\/animated_hearts\\&quot; &gt; &lt;Transformation width=\\&quot;800\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;Transformation duration=\\&quot;15\\&quot; startOffset=\\&quot;12\\&quot; \\\/&gt; &lt;Transformation overlay=\\&quot;video:docs:green_screen_queen\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#87ff66\\&quot; flags=\\&quot;relative\\&quot; width=\\&quot;1.0\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;docs\\\/animated_hearts\\&quot; &gt;\\n\\t&lt;Transformation width=\\&quot;800\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n\\t&lt;Transformation duration=\\&quot;15\\&quot; startOffset=\\&quot;12\\&quot; \\\/&gt;\\n\\t&lt;Transformation overlay=\\&quot;video:docs:green_screen_queen\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#87ff66\\&quot; flags=\\&quot;relative\\&quot; width=\\&quot;1.0\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;docs\\\/animated_hearts\\&quot; &gt; &lt;cld-transformation width=\\&quot;800\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;cld-transformation duration=\\&quot;15\\&quot; start-offset=\\&quot;12\\&quot; \\\/&gt; &lt;cld-transformation :overlay=\\&quot;video:docs:green_screen_queen\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#87ff66\\&quot; flags=\\&quot;relative\\&quot; width=\\&quot;1.0\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;docs\\\/animated_hearts\\&quot; &gt;\\n\\t&lt;cld-transformation width=\\&quot;800\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation duration=\\&quot;15\\&quot; start-offset=\\&quot;12\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation :overlay=\\&quot;video:docs:green_screen_queen\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#87ff66\\&quot; flags=\\&quot;relative\\&quot; width=\\&quot;1.0\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;docs\\\/animated_hearts\\&quot; &gt; &lt;cl-transformation width=\\&quot;800\\&quot; crop=\\&quot;scale\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation duration=\\&quot;15\\&quot; start-offset=\\&quot;12\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation overlay=\\&quot;video:docs:green_screen_queen\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#87ff66\\&quot; flags=\\&quot;relative\\&quot; width=\\&quot;1.0\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;docs\\\/animated_hearts\\&quot; &gt;\\n\\t&lt;cl-transformation width=\\&quot;800\\&quot; crop=\\&quot;scale\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation duration=\\&quot;15\\&quot; start-offset=\\&quot;12\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation overlay=\\&quot;video:docs:green_screen_queen\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#87ff66\\&quot; flags=\\&quot;relative\\&quot; width=\\&quot;1.0\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;docs\\\/animated_hearts&#039;, {transformation: [ {width: 800, crop: \\&quot;scale\\&quot;}, {duration: \\&quot;15\\&quot;, startOffset: \\&quot;12\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:green_screen_queen\\&quot;), effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#87ff66\\&quot;, flags: \\&quot;relative\\&quot;, width: \\&quot;1.0\\&quot;} ]}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;docs\\\/animated_hearts&#039;, {transformation: [\\n  {width: 800, crop: \\&quot;scale\\&quot;},\\n  {duration: \\&quot;15\\&quot;, startOffset: \\&quot;12\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:green_screen_queen\\&quot;), effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#87ff66\\&quot;, flags: \\&quot;relative\\&quot;, width: \\&quot;1.0\\&quot;}\\n  ]}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;docs\\\/animated_hearts\\&quot;).video(transformation=[ {&#039;width&#039;: 800, &#039;crop&#039;: \\&quot;scale\\&quot;}, {&#039;duration&#039;: \\&quot;15\\&quot;, &#039;start_offset&#039;: \\&quot;12\\&quot;}, {&#039;overlay&#039;: \\&quot;video:docs:green_screen_queen\\&quot;, &#039;effect&#039;: \\&quot;make_transparent:15\\&quot;, &#039;color&#039;: \\&quot;#87ff66\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;width&#039;: \\&quot;1.0\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;docs\\\/animated_hearts\\&quot;).video(transformation=[\\n  {&#039;width&#039;: 800, &#039;crop&#039;: \\&quot;scale\\&quot;},\\n  {&#039;duration&#039;: \\&quot;15\\&quot;, &#039;start_offset&#039;: \\&quot;12\\&quot;},\\n  {&#039;overlay&#039;: \\&quot;video:docs:green_screen_queen\\&quot;, &#039;effect&#039;: \\&quot;make_transparent:15\\&quot;, &#039;color&#039;: \\&quot;#87ff66\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;width&#039;: \\&quot;1.0\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;docs\\\/animated_hearts.mp4&#039;))\\n\\t-&gt;resize(Resize::scale()-&gt;width(800))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;startOffset(12.0)\\n-&gt;duration(15.0))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::video(\\&quot;docs\\\/green_screen_queen\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(1.0)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;effect(Effect::makeTransparent()-&gt;tolerance(15)\\n\\t-&gt;colorToReplace(Color::rgb(\\&quot;87ff66\\&quot;))\\n\\t))\\n\\t));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;docs\\\/animated_hearts.mp4&#039;))\\n\\t-&gt;resize(Resize::scale()-&gt;width(800))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;startOffset(12.0)\\n-&gt;duration(15.0))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::video(\\&quot;docs\\\/green_screen_queen\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(1.0)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;effect(Effect::makeTransparent()-&gt;tolerance(15)\\n\\t-&gt;colorToReplace(Color::rgb(\\&quot;87ff66\\&quot;))\\n\\t))\\n\\t));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;docs\\\/animated_hearts\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array( array(\\&quot;width\\&quot;=&gt;800, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;), array(\\&quot;duration\\&quot;=&gt;\\&quot;15\\&quot;, \\&quot;start_offset\\&quot;=&gt;\\&quot;12\\&quot;), array(\\&quot;overlay\\&quot;=&gt;\\&quot;video:docs:green_screen_queen\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;make_transparent:15\\&quot;, \\&quot;color\\&quot;=&gt;\\&quot;#87ff66\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;1.0\\&quot;) )))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;docs\\\/animated_hearts\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array(\\n  array(\\&quot;width\\&quot;=&gt;800, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;),\\n  array(\\&quot;duration\\&quot;=&gt;\\&quot;15\\&quot;, \\&quot;start_offset\\&quot;=&gt;\\&quot;12\\&quot;),\\n  array(\\&quot;overlay\\&quot;=&gt;\\&quot;video:docs:green_screen_queen\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;make_transparent:15\\&quot;, \\&quot;color\\&quot;=&gt;\\&quot;#87ff66\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;1.0\\&quot;)\\n  )))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().width(800).crop(\\&quot;scale\\&quot;).chain() .duration(\\&quot;15\\&quot;).startOffset(\\&quot;12\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;video:docs:green_screen_queen\\&quot;)).effect(\\&quot;make_transparent:15\\&quot;).color(\\&quot;#87ff66\\&quot;).flags(\\&quot;relative\\&quot;).width(1.0)).videoTag(\\&quot;docs\\\/animated_hearts\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation()\\n  .width(800).crop(\\&quot;scale\\&quot;).chain()\\n  .duration(\\&quot;15\\&quot;).startOffset(\\&quot;12\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;video:docs:green_screen_queen\\&quot;)).effect(\\&quot;make_transparent:15\\&quot;).color(\\&quot;#87ff66\\&quot;).flags(\\&quot;relative\\&quot;).width(1.0)).videoTag(\\&quot;docs\\\/animated_hearts\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;docs\\\/animated_hearts\\&quot;, transformation: [ {width: 800, crop: \\&quot;scale\\&quot;}, {duration: \\&quot;15\\&quot;, start_offset: \\&quot;12\\&quot;}, {overlay: \\&quot;video:docs:green_screen_queen\\&quot;, effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#87ff66\\&quot;, flags: \\&quot;relative\\&quot;, width: 1.0} ])&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;docs\\\/animated_hearts\\&quot;, transformation: [\\n  {width: 800, crop: \\&quot;scale\\&quot;},\\n  {duration: \\&quot;15\\&quot;, start_offset: \\&quot;12\\&quot;},\\n  {overlay: \\&quot;video:docs:green_screen_queen\\&quot;, effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#87ff66\\&quot;, flags: \\&quot;relative\\&quot;, width: 1.0}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Width(800).Crop(\\&quot;scale\\&quot;).Chain() .Duration(\\&quot;15\\&quot;).StartOffset(\\&quot;12\\&quot;).Chain() .Overlay(new Layer().PublicId(\\&quot;video:docs:green_screen_queen\\&quot;)).Effect(\\&quot;make_transparent:15\\&quot;).Color(\\&quot;#87ff66\\&quot;).Flags(\\&quot;relative\\&quot;).Width(1.0)).BuildVideoTag(\\&quot;docs\\\/animated_hearts\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation()\\n  .Width(800).Crop(\\&quot;scale\\&quot;).Chain()\\n  .Duration(\\&quot;15\\&quot;).StartOffset(\\&quot;12\\&quot;).Chain()\\n  .Overlay(new Layer().PublicId(\\&quot;video:docs:green_screen_queen\\&quot;)).Effect(\\&quot;make_transparent:15\\&quot;).Color(\\&quot;#87ff66\\&quot;).Flags(\\&quot;relative\\&quot;).Width(1.0)).BuildVideoTag(\\&quot;docs\\\/animated_hearts\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;docs\\\/animated_hearts.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(800))\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;12.0&#039;)\\n.duration(&#039;15.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/green_screen_queen\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(&#039;1.0&#039;)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(15)\\n\\t.colorToReplace(Color.rgb(\\&quot;87ff66\\&quot;))\\n\\t))\\n\\t)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;docs\\\/animated_hearts.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(800))\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;12.0&#039;)\\n.duration(&#039;15.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/green_screen_queen\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(&#039;1.0&#039;)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(15)\\n\\t.colorToReplace(Color.rgb(\\&quot;87ff66\\&quot;))\\n\\t))\\n\\t)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setWidth(800).setCrop(\\&quot;scale\\&quot;).chain() .setDuration(\\&quot;15\\&quot;).setStartOffset(\\&quot;12\\&quot;).chain() .setOverlay(\\&quot;video:docs:green_screen_queen\\&quot;).setEffect(\\&quot;make_transparent:15\\&quot;).setColor(\\&quot;#87ff66\\&quot;).setFlags(\\&quot;relative\\&quot;).setWidth(1.0)).generate(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation()\\n  .setWidth(800).setCrop(\\&quot;scale\\&quot;).chain()\\n  .setDuration(\\&quot;15\\&quot;).setStartOffset(\\&quot;12\\&quot;).chain()\\n  .setOverlay(\\&quot;video:docs:green_screen_queen\\&quot;).setEffect(\\&quot;make_transparent:15\\&quot;).setColor(\\&quot;#87ff66\\&quot;).setFlags(\\&quot;relative\\&quot;).setWidth(1.0)).generate(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().width(800).crop(\\&quot;scale\\&quot;).chain() .duration(\\&quot;15\\&quot;).startOffset(\\&quot;12\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;video:docs:green_screen_queen\\&quot;)).effect(\\&quot;make_transparent:15\\&quot;).color(\\&quot;#87ff66\\&quot;).flags(\\&quot;relative\\&quot;).width(1.0)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;docs\\\/animated_hearts.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation()\\n  .width(800).crop(\\&quot;scale\\&quot;).chain()\\n  .duration(\\&quot;15\\&quot;).startOffset(\\&quot;12\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;video:docs:green_screen_queen\\&quot;)).effect(\\&quot;make_transparent:15\\&quot;).color(\\&quot;#87ff66\\&quot;).flags(\\&quot;relative\\&quot;).width(1.0)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;docs\\\/animated_hearts.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;docs\\\/animated_hearts.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(800))\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;12.0&#039;)\\n.duration(&#039;15.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/green_screen_queen\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(&#039;1.0&#039;)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(15)\\n\\t.colorToReplace(Color.rgb(\\&quot;87ff66\\&quot;))\\n\\t))\\n\\t)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;docs\\\/animated_hearts.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(800))\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;12.0&#039;)\\n.duration(&#039;15.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/green_screen_queen\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(&#039;1.0&#039;)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(15)\\n\\t.colorToReplace(Color.rgb(\\&quot;87ff66\\&quot;))\\n\\t))\\n\\t)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n\\t resize(Resize.scale() { width(800) })\\n\\t videoEdit(VideoEdit.trim() { startOffset(12.0F)\\n duration(15.0F) })\\n\\t overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/green_screen_queen\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(1.0F)\\n\\t relative()\\n\\t })\\n\\t effect(Effect.makeTransparent() { tolerance(15)\\n\\t colorToReplace(Color.rgb(\\&quot;87ff66\\&quot;))\\n\\t }) })\\n\\t })) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n\\t resize(Resize.scale() { width(800) })\\n\\t videoEdit(VideoEdit.trim() { startOffset(12.0F)\\n duration(15.0F) })\\n\\t overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/green_screen_queen\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(1.0F)\\n\\t relative()\\n\\t })\\n\\t effect(Effect.makeTransparent() { tolerance(15)\\n\\t colorToReplace(Color.rgb(\\&quot;87ff66\\&quot;))\\n\\t }) })\\n\\t })) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;docs\\\/animated_hearts\\&quot;, {transformation: [ {width: 800, crop: \\&quot;scale\\&quot;}, {duration: \\&quot;15\\&quot;, start_offset: \\&quot;12\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:green_screen_queen\\&quot;), effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#87ff66\\&quot;, flags: \\&quot;relative\\&quot;, width: \\&quot;1.0\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;docs\\\/animated_hearts\\&quot;, {transformation: [\\n  {width: 800, crop: \\&quot;scale\\&quot;},\\n  {duration: \\&quot;15\\&quot;, start_offset: \\&quot;12\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:green_screen_queen\\&quot;), effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#87ff66\\&quot;, flags: \\&quot;relative\\&quot;, width: \\&quot;1.0\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/animated_hearts.mp4\\&quot;)\\n  .resize(scale().width(800))\\n  .videoEdit(trim().startOffset(\\&quot;12.0\\&quot;).duration(\\&quot;15.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/green_screen_queen\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#87ff66\\&quot;))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/w_800\\\/du_15,so_12\\\/l_video:docs:green_screen_queen,e_make_transparent:15,co_rgb:87ff66,fl_relative,w_1.0\\\/docs\\\/animated_hearts.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;width&quot;:&quot;800&quot;},{&quot;duration&quot;:&quot;15&quot;,&quot;start_offset&quot;:&quot;12&quot;},{&quot;overlay&quot;:&quot;video:docs:green_screen_queen&quot;,&quot;effect&quot;:&quot;make_transparent:15&quot;,&quot;color&quot;:&quot;rgb:87ff66&quot;,&quot;flags&quot;:&quot;relative&quot;,&quot;width&quot;:&quot;1.0&quot;}],&quot;transformation_string&quot;:&quot;w_800\\\/du_15,so_12\\\/l_video:docs:green_screen_queen,e_make_transparent:15,co_rgb:87ff66,fl_relative,w_1.0&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:null,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;docs\\\/animated_hearts.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><\/p>\n<h2>Seeing through the URL<\/h2>\n<p>In case you haven\u2019t played with Cloudinary transformation URLs before, here\u2019s a quick walk through (or \u2018see through\u2019, if you will):<\/p>\n<ul>\n<li>\n<code>https:\/\/res.cloudinary.com\/demo\/video\/upload...<\/code>\nThe first part of the URL defines your Cloudinary account and how\/where the video to deliver is stored in your account.<\/li>\n<li>\n<strong>\u2026\/w_800\/du_15,so_12\u2026<\/strong><br\/>The next two components are transformations that scale the video down to a width of <code>800<\/code> pixels and shorten the overall video duration to <code>15<\/code> seconds.<\/li>\n<li>\n<strong>\u2026\/l_video:docs:green_screen_queen,\u2026<\/strong><br\/>Now the fun part. The <code>\/l_<\/code> component ( <code>overlay<\/code> in SDKs) adds the  <strong>green_screen_queen<\/strong> video (from the <code>\/docs<\/code> folder) as a layer over the base <strong>animated_hearts<\/strong> video.\n<ul>\n<li>\n<strong>\u2026e_make_transparent:15,co_rgb:87ff66,\u2026<\/strong><br\/>The <code>make_transparent<\/code> parameter is applied to the overlay video with a tolerance of <code>15<\/code> to allow for minor color variations, and specifies that the transparency should be applied to the hex color <code>87ff66<\/code> (the particular shade of green that the Queen chose to wear).<\/li>\n<li>\n<strong>\u2026fl_relative,w_1.0\u2026<\/strong><br\/>Additionally, the overlayed video is width is scaled to 1.0 (100%) relative to the width of the base video so that the top layer exactly covers the base video.<\/li>\n<\/ul>\n<\/li>\n<li>\n<strong>\u2026\/docs\/animated_hearts.mp4<\/strong><br\/>Finally, we specify the base video: <strong>animated_hearts.mp4<\/strong> (also from the <code>\/docs<\/code> folder). In this case, the base video will actually be hiding behind the identically-sized queen video layer, and will show through only where the top video layer is transparent.<\/li>\n<\/ul>\n<p>Seconds after you deliver this URL for the first time, your video is generated and the specified green color is transparent throughout the duration, regardless of where that color appears or moves within your video.<\/p>\n<h2>It\u2019s Not Easy Being Green<\/h2>\n<p>\u201cGreen screen\u201d transparency for both image and video isn\u2019t a new concept of-course, but usually it requires manually applying the transparency in video editing software. Additionally, most of these video editors can only achieve video transparency for a specific and very solid shade of green or in some cases, maybe a specific royal blue color. But that specific green (or blue) requirement can be limiting.<\/p>\n<p>In contrast, Cloudinary\u2019s <strong>make_transparent<\/strong> feature, isn\u2019t picky at all. Specify any hex color, along with an optional tolerance level, and go. For example, all we have to do is change the color code accompanying the <code>make_transparent<\/code> parameter to a light-red shade (<code>#ff4d4b<\/code>) in the URL we used above, and now it\u2019s the footmens\u2019 previously light-red uniforms who are getting the love:<\/p>\n<video style=\"margin: 0 auto;display: block\" controls=\"controls\" preload=\"none\" muted  width=600 poster=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/q_auto,f_auto\/docs\/footmen_hearts_poster.jpg\">\n  <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/du_15,so_12\/l_video:docs:green_screen_queen,e_make_transparent:15,co_rgb:ff4d4b,fl_relative,w_1.0\/docs\/animated_hearts.webm\" type=\"video\/webm\">\n  <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/du_15,so_12\/l_video:docs:green_screen_queen,e_make_transparent:15,co_rgb:ff4d4b,fl_relative,w_1.0\/docs\/animated_hearts.mp4\" type=\"video\/mp4\">\n  <source src=https:\/\/res.cloudinary.com\/demo\/video\/upload\/du_15,so_12\/l_video:docs:green_screen_queen,e_make_transparent:15,co_rgb:ff4d4b,fl_relative,w_1.0\/docs\/animated_hearts.ogv\" type=\"video\/ogg\">\n<\/video>\n<h2>It\u2019s time to get serious<\/h2>\n<p>No doubt that redesigning clothes using video transparency can be entertaining, but there are more practical uses for the <code>make_transparent<\/code> video transformation.<\/p>\n<p>For example, what if you want to deliver a video tutorial or product demo with a talking head? No special green-screen studio is necessary. Just find any solid colored wall or hang a sheet in a color that\u2019s not too similar to the speaker\u2019s face color or clothing, and then use <code>make_transparent<\/code> to remove the video background.<\/p>\n<p>Here\u2019s a video we created in our turquoise-painted meeting room:<\/p>\n<p><video\n      controls\n      muted\n      preload=\"none\"\n      class=\"c-transformed-asset c-transformed-asset--video\"\n      poster=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_0\/docs\/talking_head_travel.jpg\"\n       width=\"600\"\n    >\n      <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_0\/vc_h265\/docs\/talking_head_travel.mp4\" type=\"video\/mp4; codecs=hevc\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_0\/vc_vp9\/docs\/talking_head_travel.webm\" type=\"video\/webm; codecs=vp9\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_0\/vc_auto\/docs\/talking_head_travel.mp4\" type=\"video\/mp4\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_0\/vc_auto\/docs\/talking_head_travel.webm\" type=\"video\/webm\">\n    <\/video><\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;docs\\\/talking_head_travel\\&quot; &gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;docs\\\/talking_head_travel\\&quot; &gt;\\n\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;docs\\\/talking_head_travel\\&quot; &gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;docs\\\/talking_head_travel\\&quot; &gt;\\n\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;docs\\\/talking_head_travel\\&quot; &gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;docs\\\/talking_head_travel\\&quot; &gt;\\n\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;docs\\\/talking_head_travel&#039;).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;docs\\\/talking_head_travel&#039;).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;docs\\\/talking_head_travel\\&quot;).video()&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;docs\\\/talking_head_travel\\&quot;).video()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;docs\\\/talking_head_travel.mp4&#039;));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;docs\\\/talking_head_travel.mp4&#039;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().videoTag(\\&quot;docs\\\/talking_head_travel\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().videoTag(\\&quot;docs\\\/talking_head_travel\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.BuildVideoTag(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.BuildVideoTag(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;docs\\\/talking_head_travel.mp4&#039;).transformation(Transformation());&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;docs\\\/talking_head_travel.mp4&#039;).transformation(Transformation());&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).generate(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).generate(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().resourceType(\\&quot;video\\&quot;).generate(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().resourceType(\\&quot;video\\&quot;).generate(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;docs\\\/talking_head_travel.mp4&#039;).transformation(Transformation());&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;docs\\\/talking_head_travel.mp4&#039;).transformation(Transformation());&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;docs\\\/talking_head_travel\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;docs\\\/talking_head_travel.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/docs\\\/talking_head_travel.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[],&quot;transformation_string&quot;:&quot;&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:null,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;docs\\\/talking_head_travel.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><\/p>\n<p>Now we just overlay this talking_head video on top of the video he\u2019s supposed to be talking about, set the transparency color to match the paint color, and we can send our narrator anywhere we want. How about a quick trip to Africa?<\/p>\n<video style=\"margin: 0 auto;display: block\" controls=\"controls\" preload=\"none\"  width=600 poster=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/f_auto,q_auto\/docs\/talkhead_elephants_poster.jpg\">\n  <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_8\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_1.0,fl_relative\/du_10\/elephants.webm\" type=\"video\/webm\">\n  <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_8\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_1.0,fl_relative\/du_10\/elephants.mp4\" type=\"video\/mp4\">\n  <source src=https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_8\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_1.0,fl_relative\/du_10\/elephants.ogv\" type=\"video\/ogg\">\n<\/video>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;elephants\\&quot;, {transformation: [ {start_offset: \\&quot;8\\&quot;}, {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;1.0\\&quot;, flags: \\&quot;relative\\&quot;}, {duration: \\&quot;10\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;elephants\\&quot;, {transformation: [\\n  {start_offset: \\&quot;8\\&quot;},\\n  {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;1.0\\&quot;, flags: \\&quot;relative\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;elephants\\&quot; &gt; &lt;Transformation startOffset=\\&quot;8\\&quot; \\\/&gt; &lt;Transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;1.0\\&quot; flags=\\&quot;relative\\&quot; \\\/&gt; &lt;Transformation duration=\\&quot;10\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;elephants\\&quot; &gt;\\n\\t&lt;Transformation startOffset=\\&quot;8\\&quot; \\\/&gt;\\n\\t&lt;Transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;1.0\\&quot; flags=\\&quot;relative\\&quot; \\\/&gt;\\n\\t&lt;Transformation duration=\\&quot;10\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;elephants\\&quot; &gt; &lt;cld-transformation start-offset=\\&quot;8\\&quot; \\\/&gt; &lt;cld-transformation :overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;1.0\\&quot; flags=\\&quot;relative\\&quot; \\\/&gt; &lt;cld-transformation duration=\\&quot;10\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;elephants\\&quot; &gt;\\n\\t&lt;cld-transformation start-offset=\\&quot;8\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation :overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;1.0\\&quot; flags=\\&quot;relative\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation duration=\\&quot;10\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;elephants\\&quot; &gt; &lt;cl-transformation start-offset=\\&quot;8\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;1.0\\&quot; flags=\\&quot;relative\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation duration=\\&quot;10\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;elephants\\&quot; &gt;\\n\\t&lt;cl-transformation start-offset=\\&quot;8\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;1.0\\&quot; flags=\\&quot;relative\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation duration=\\&quot;10\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;elephants&#039;, {transformation: [ {startOffset: \\&quot;8\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;1.0\\&quot;, flags: \\&quot;relative\\&quot;}, {duration: \\&quot;10\\&quot;} ]}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;elephants&#039;, {transformation: [\\n  {startOffset: \\&quot;8\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;1.0\\&quot;, flags: \\&quot;relative\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ]}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;elephants\\&quot;).video(transformation=[ {&#039;start_offset&#039;: \\&quot;8\\&quot;}, {&#039;overlay&#039;: \\&quot;video:docs:talking_head_travel\\&quot;, &#039;effect&#039;: \\&quot;make_transparent:18\\&quot;, &#039;color&#039;: \\&quot;#5ec2c4\\&quot;, &#039;width&#039;: \\&quot;1.0\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;}, {&#039;duration&#039;: \\&quot;10\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;elephants\\&quot;).video(transformation=[\\n  {&#039;start_offset&#039;: \\&quot;8\\&quot;},\\n  {&#039;overlay&#039;: \\&quot;video:docs:talking_head_travel\\&quot;, &#039;effect&#039;: \\&quot;make_transparent:18\\&quot;, &#039;color&#039;: \\&quot;#5ec2c4\\&quot;, &#039;width&#039;: \\&quot;1.0\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;},\\n  {&#039;duration&#039;: \\&quot;10\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;elephants.mp4&#039;))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;startOffset(8.0))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(1.0)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;effect(Effect::makeTransparent()-&gt;tolerance(18)\\n\\t-&gt;colorToReplace(Color::rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;duration(10.0));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;elephants.mp4&#039;))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;startOffset(8.0))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(1.0)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;effect(Effect::makeTransparent()-&gt;tolerance(18)\\n\\t-&gt;colorToReplace(Color::rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;duration(10.0));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;elephants\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array( array(\\&quot;start_offset\\&quot;=&gt;\\&quot;8\\&quot;), array(\\&quot;overlay\\&quot;=&gt;\\&quot;video:docs:talking_head_travel\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;make_transparent:18\\&quot;, \\&quot;color\\&quot;=&gt;\\&quot;#5ec2c4\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;1.0\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;), array(\\&quot;duration\\&quot;=&gt;\\&quot;10\\&quot;) )))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;elephants\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array(\\n  array(\\&quot;start_offset\\&quot;=&gt;\\&quot;8\\&quot;),\\n  array(\\&quot;overlay\\&quot;=&gt;\\&quot;video:docs:talking_head_travel\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;make_transparent:18\\&quot;, \\&quot;color\\&quot;=&gt;\\&quot;#5ec2c4\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;1.0\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;),\\n  array(\\&quot;duration\\&quot;=&gt;\\&quot;10\\&quot;)\\n  )))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().startOffset(\\&quot;8\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:18\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(1.0).flags(\\&quot;relative\\&quot;).chain() .duration(\\&quot;10\\&quot;)).videoTag(\\&quot;elephants\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation()\\n  .startOffset(\\&quot;8\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:18\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(1.0).flags(\\&quot;relative\\&quot;).chain()\\n  .duration(\\&quot;10\\&quot;)).videoTag(\\&quot;elephants\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;elephants\\&quot;, transformation: [ {start_offset: \\&quot;8\\&quot;}, {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: 1.0, flags: \\&quot;relative\\&quot;}, {duration: \\&quot;10\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;elephants\\&quot;, transformation: [\\n  {start_offset: \\&quot;8\\&quot;},\\n  {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: 1.0, flags: \\&quot;relative\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().StartOffset(\\&quot;8\\&quot;).Chain() .Overlay(new Layer().PublicId(\\&quot;video:docs:talking_head_travel\\&quot;)).Effect(\\&quot;make_transparent:18\\&quot;).Color(\\&quot;#5ec2c4\\&quot;).Width(1.0).Flags(\\&quot;relative\\&quot;).Chain() .Duration(\\&quot;10\\&quot;)).BuildVideoTag(\\&quot;elephants\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation()\\n  .StartOffset(\\&quot;8\\&quot;).Chain()\\n  .Overlay(new Layer().PublicId(\\&quot;video:docs:talking_head_travel\\&quot;)).Effect(\\&quot;make_transparent:18\\&quot;).Color(\\&quot;#5ec2c4\\&quot;).Width(1.0).Flags(\\&quot;relative\\&quot;).Chain()\\n  .Duration(\\&quot;10\\&quot;)).BuildVideoTag(\\&quot;elephants\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;elephants.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;8.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(&#039;1.0&#039;)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(18)\\n\\t.colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t))\\n\\t.videoEdit(VideoEdit.trim().duration(&#039;10.0&#039;)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;elephants.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;8.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(&#039;1.0&#039;)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(18)\\n\\t.colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t))\\n\\t.videoEdit(VideoEdit.trim().duration(&#039;10.0&#039;)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setStartOffset(\\&quot;8\\&quot;).chain() .setOverlay(\\&quot;video:docs:talking_head_travel\\&quot;).setEffect(\\&quot;make_transparent:18\\&quot;).setColor(\\&quot;#5ec2c4\\&quot;).setWidth(1.0).setFlags(\\&quot;relative\\&quot;).chain() .setDuration(\\&quot;10\\&quot;)).generate(\\&quot;elephants.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation()\\n  .setStartOffset(\\&quot;8\\&quot;).chain()\\n  .setOverlay(\\&quot;video:docs:talking_head_travel\\&quot;).setEffect(\\&quot;make_transparent:18\\&quot;).setColor(\\&quot;#5ec2c4\\&quot;).setWidth(1.0).setFlags(\\&quot;relative\\&quot;).chain()\\n  .setDuration(\\&quot;10\\&quot;)).generate(\\&quot;elephants.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().startOffset(\\&quot;8\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:18\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(1.0).flags(\\&quot;relative\\&quot;).chain() .duration(\\&quot;10\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;elephants.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation()\\n  .startOffset(\\&quot;8\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:18\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(1.0).flags(\\&quot;relative\\&quot;).chain()\\n  .duration(\\&quot;10\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;elephants.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;elephants.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;8.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(&#039;1.0&#039;)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(18)\\n\\t.colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t))\\n\\t.videoEdit(VideoEdit.trim().duration(&#039;10.0&#039;)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;elephants.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;8.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(&#039;1.0&#039;)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(18)\\n\\t.colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t))\\n\\t.videoEdit(VideoEdit.trim().duration(&#039;10.0&#039;)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;elephants.mp4\\&quot;)\\n\\t videoEdit(VideoEdit.trim() { startOffset(8.0F) })\\n\\t overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(1.0F)\\n\\t relative()\\n\\t })\\n\\t effect(Effect.makeTransparent() { tolerance(18)\\n\\t colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t }) })\\n\\t }))\\n\\t videoEdit(VideoEdit.trim() { duration(10.0F) }) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;elephants.mp4\\&quot;)\\n\\t videoEdit(VideoEdit.trim() { startOffset(8.0F) })\\n\\t overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(1.0F)\\n\\t relative()\\n\\t })\\n\\t effect(Effect.makeTransparent() { tolerance(18)\\n\\t colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t }) })\\n\\t }))\\n\\t videoEdit(VideoEdit.trim() { duration(10.0F) }) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;elephants\\&quot;, {transformation: [ {start_offset: \\&quot;8\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;1.0\\&quot;, flags: \\&quot;relative\\&quot;}, {duration: \\&quot;10\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;elephants\\&quot;, {transformation: [\\n  {start_offset: \\&quot;8\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;1.0\\&quot;, flags: \\&quot;relative\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;elephants.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(\\&quot;1.0\\&quot;).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    )\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/so_8\\\/l_video:docs:talking_head_travel,e_make_transparent:18,co_rgb:5ec2c4,w_1.0,fl_relative\\\/du_10\\\/elephants.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;start_offset&quot;:&quot;8&quot;},{&quot;overlay&quot;:&quot;video:docs:talking_head_travel&quot;,&quot;effect&quot;:&quot;make_transparent:18&quot;,&quot;color&quot;:&quot;rgb:5ec2c4&quot;,&quot;width&quot;:&quot;1.0&quot;,&quot;flags&quot;:&quot;relative&quot;},{&quot;duration&quot;:&quot;10&quot;}],&quot;transformation_string&quot;:&quot;so_8\\\/l_video:docs:talking_head_travel,e_make_transparent:18,co_rgb:5ec2c4,w_1.0,fl_relative\\\/du_10&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;elephants.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><\/p>\n<p>We can also choose what size we\u2019d like our overlay speaker to be, either relative to the base (background) video or as a fixed pixel size, and where we\u2019d like to place him. Here, we didn\u2019t want to make our speaker look too big relative to the entire galaxy, so we made him a bit smaller (40% of the base video width), and moved the transparent video overlay to the bottom right of the base video:<\/p>\n<video style=\"margin: 0 auto;display: block\" controls=\"controls\" preload=\"none\"  width=600 poster=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/q_auto,f_auto\/docs\/talkhead_galaxy_poster.jpg\">\n  <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_8\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.4,fl_relative,g_south_east\/du_10\/galaxy_spin.webm\" type=\"video\/webm\">\n  <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_8\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.4,fl_relative,g_south_east\/du_10\/galaxy_spin.mp4\" type=\"video\/mp4\">\n  <source src=https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_8\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.4,fl_relative,g_south_east\/du_10\/galaxy_spin.ogv\" type=\"video\/ogg\">\n<\/video>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;galaxy_spin\\&quot;, {transformation: [ {start_offset: \\&quot;8\\&quot;}, {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.4\\&quot;, flags: \\&quot;relative\\&quot;, gravity: \\&quot;south_east\\&quot;}, {duration: \\&quot;10\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;galaxy_spin\\&quot;, {transformation: [\\n  {start_offset: \\&quot;8\\&quot;},\\n  {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.4\\&quot;, flags: \\&quot;relative\\&quot;, gravity: \\&quot;south_east\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;galaxy_spin\\&quot; &gt; &lt;Transformation startOffset=\\&quot;8\\&quot; \\\/&gt; &lt;Transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.4\\&quot; flags=\\&quot;relative\\&quot; gravity=\\&quot;south_east\\&quot; \\\/&gt; &lt;Transformation duration=\\&quot;10\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;galaxy_spin\\&quot; &gt;\\n\\t&lt;Transformation startOffset=\\&quot;8\\&quot; \\\/&gt;\\n\\t&lt;Transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.4\\&quot; flags=\\&quot;relative\\&quot; gravity=\\&quot;south_east\\&quot; \\\/&gt;\\n\\t&lt;Transformation duration=\\&quot;10\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;galaxy_spin\\&quot; &gt; &lt;cld-transformation start-offset=\\&quot;8\\&quot; \\\/&gt; &lt;cld-transformation :overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.4\\&quot; flags=\\&quot;relative\\&quot; gravity=\\&quot;south_east\\&quot; \\\/&gt; &lt;cld-transformation duration=\\&quot;10\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;galaxy_spin\\&quot; &gt;\\n\\t&lt;cld-transformation start-offset=\\&quot;8\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation :overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.4\\&quot; flags=\\&quot;relative\\&quot; gravity=\\&quot;south_east\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation duration=\\&quot;10\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;galaxy_spin\\&quot; &gt; &lt;cl-transformation start-offset=\\&quot;8\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.4\\&quot; flags=\\&quot;relative\\&quot; gravity=\\&quot;south_east\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation duration=\\&quot;10\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;galaxy_spin\\&quot; &gt;\\n\\t&lt;cl-transformation start-offset=\\&quot;8\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:18\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.4\\&quot; flags=\\&quot;relative\\&quot; gravity=\\&quot;south_east\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation duration=\\&quot;10\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;galaxy_spin&#039;, {transformation: [ {startOffset: \\&quot;8\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.4\\&quot;, flags: \\&quot;relative\\&quot;, gravity: \\&quot;south_east\\&quot;}, {duration: \\&quot;10\\&quot;} ]}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;galaxy_spin&#039;, {transformation: [\\n  {startOffset: \\&quot;8\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.4\\&quot;, flags: \\&quot;relative\\&quot;, gravity: \\&quot;south_east\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ]}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;galaxy_spin\\&quot;).video(transformation=[ {&#039;start_offset&#039;: \\&quot;8\\&quot;}, {&#039;overlay&#039;: \\&quot;video:docs:talking_head_travel\\&quot;, &#039;effect&#039;: \\&quot;make_transparent:18\\&quot;, &#039;color&#039;: \\&quot;#5ec2c4\\&quot;, &#039;width&#039;: \\&quot;0.4\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;gravity&#039;: \\&quot;south_east\\&quot;}, {&#039;duration&#039;: \\&quot;10\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;galaxy_spin\\&quot;).video(transformation=[\\n  {&#039;start_offset&#039;: \\&quot;8\\&quot;},\\n  {&#039;overlay&#039;: \\&quot;video:docs:talking_head_travel\\&quot;, &#039;effect&#039;: \\&quot;make_transparent:18\\&quot;, &#039;color&#039;: \\&quot;#5ec2c4\\&quot;, &#039;width&#039;: \\&quot;0.4\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;gravity&#039;: \\&quot;south_east\\&quot;},\\n  {&#039;duration&#039;: \\&quot;10\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;galaxy_spin.mp4&#039;))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;startOffset(8.0))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.4)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;effect(Effect::makeTransparent()-&gt;tolerance(18)\\n\\t-&gt;colorToReplace(Color::rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t)\\n\\t-&gt;position((new Position())\\n\\t-&gt;gravity(\\n\\tGravity::compass(\\n\\tCompass::southEast()))\\n\\t)\\n\\t)\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;duration(10.0));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;galaxy_spin.mp4&#039;))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;startOffset(8.0))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.4)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;effect(Effect::makeTransparent()-&gt;tolerance(18)\\n\\t-&gt;colorToReplace(Color::rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t)\\n\\t-&gt;position((new Position())\\n\\t-&gt;gravity(\\n\\tGravity::compass(\\n\\tCompass::southEast()))\\n\\t)\\n\\t)\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;duration(10.0));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;galaxy_spin\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array( array(\\&quot;start_offset\\&quot;=&gt;\\&quot;8\\&quot;), array(\\&quot;overlay\\&quot;=&gt;\\&quot;video:docs:talking_head_travel\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;make_transparent:18\\&quot;, \\&quot;color\\&quot;=&gt;\\&quot;#5ec2c4\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;0.4\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;gravity\\&quot;=&gt;\\&quot;south_east\\&quot;), array(\\&quot;duration\\&quot;=&gt;\\&quot;10\\&quot;) )))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;galaxy_spin\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array(\\n  array(\\&quot;start_offset\\&quot;=&gt;\\&quot;8\\&quot;),\\n  array(\\&quot;overlay\\&quot;=&gt;\\&quot;video:docs:talking_head_travel\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;make_transparent:18\\&quot;, \\&quot;color\\&quot;=&gt;\\&quot;#5ec2c4\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;0.4\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;gravity\\&quot;=&gt;\\&quot;south_east\\&quot;),\\n  array(\\&quot;duration\\&quot;=&gt;\\&quot;10\\&quot;)\\n  )))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().startOffset(\\&quot;8\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:18\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(0.4).flags(\\&quot;relative\\&quot;).gravity(\\&quot;south_east\\&quot;).chain() .duration(\\&quot;10\\&quot;)).videoTag(\\&quot;galaxy_spin\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation()\\n  .startOffset(\\&quot;8\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:18\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(0.4).flags(\\&quot;relative\\&quot;).gravity(\\&quot;south_east\\&quot;).chain()\\n  .duration(\\&quot;10\\&quot;)).videoTag(\\&quot;galaxy_spin\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;galaxy_spin\\&quot;, transformation: [ {start_offset: \\&quot;8\\&quot;}, {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: 0.4, flags: \\&quot;relative\\&quot;, gravity: \\&quot;south_east\\&quot;}, {duration: \\&quot;10\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;galaxy_spin\\&quot;, transformation: [\\n  {start_offset: \\&quot;8\\&quot;},\\n  {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: 0.4, flags: \\&quot;relative\\&quot;, gravity: \\&quot;south_east\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().StartOffset(\\&quot;8\\&quot;).Chain() .Overlay(new Layer().PublicId(\\&quot;video:docs:talking_head_travel\\&quot;)).Effect(\\&quot;make_transparent:18\\&quot;).Color(\\&quot;#5ec2c4\\&quot;).Width(0.4).Flags(\\&quot;relative\\&quot;).Gravity(\\&quot;south_east\\&quot;).Chain() .Duration(\\&quot;10\\&quot;)).BuildVideoTag(\\&quot;galaxy_spin\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation()\\n  .StartOffset(\\&quot;8\\&quot;).Chain()\\n  .Overlay(new Layer().PublicId(\\&quot;video:docs:talking_head_travel\\&quot;)).Effect(\\&quot;make_transparent:18\\&quot;).Color(\\&quot;#5ec2c4\\&quot;).Width(0.4).Flags(\\&quot;relative\\&quot;).Gravity(\\&quot;south_east\\&quot;).Chain()\\n  .Duration(\\&quot;10\\&quot;)).BuildVideoTag(\\&quot;galaxy_spin\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;galaxy_spin.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;8.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.4)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(18)\\n\\t.colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t)\\n\\t.position(Position()\\n\\t.gravity(\\n\\tGravity.compass(\\n\\tCompass.southEast()))\\n\\t)\\n\\t)\\n\\t.videoEdit(VideoEdit.trim().duration(&#039;10.0&#039;)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;galaxy_spin.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;8.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.4)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(18)\\n\\t.colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t)\\n\\t.position(Position()\\n\\t.gravity(\\n\\tGravity.compass(\\n\\tCompass.southEast()))\\n\\t)\\n\\t)\\n\\t.videoEdit(VideoEdit.trim().duration(&#039;10.0&#039;)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setStartOffset(\\&quot;8\\&quot;).chain() .setOverlay(\\&quot;video:docs:talking_head_travel\\&quot;).setEffect(\\&quot;make_transparent:18\\&quot;).setColor(\\&quot;#5ec2c4\\&quot;).setWidth(0.4).setFlags(\\&quot;relative\\&quot;).setGravity(\\&quot;south_east\\&quot;).chain() .setDuration(\\&quot;10\\&quot;)).generate(\\&quot;galaxy_spin.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation()\\n  .setStartOffset(\\&quot;8\\&quot;).chain()\\n  .setOverlay(\\&quot;video:docs:talking_head_travel\\&quot;).setEffect(\\&quot;make_transparent:18\\&quot;).setColor(\\&quot;#5ec2c4\\&quot;).setWidth(0.4).setFlags(\\&quot;relative\\&quot;).setGravity(\\&quot;south_east\\&quot;).chain()\\n  .setDuration(\\&quot;10\\&quot;)).generate(\\&quot;galaxy_spin.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().startOffset(\\&quot;8\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:18\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(0.4).flags(\\&quot;relative\\&quot;).gravity(\\&quot;south_east\\&quot;).chain() .duration(\\&quot;10\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;galaxy_spin.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation()\\n  .startOffset(\\&quot;8\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:18\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(0.4).flags(\\&quot;relative\\&quot;).gravity(\\&quot;south_east\\&quot;).chain()\\n  .duration(\\&quot;10\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;galaxy_spin.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;galaxy_spin.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;8.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.4)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(18)\\n\\t.colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t)\\n\\t.position(Position()\\n\\t.gravity(\\n\\tGravity.compass(\\n\\tCompass.southEast()))\\n\\t)\\n\\t)\\n\\t.videoEdit(VideoEdit.trim().duration(&#039;10.0&#039;)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;galaxy_spin.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(&#039;8.0&#039;))\\n\\t.overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.4)\\n\\t.relative()\\n\\t)\\n\\t.effect(Effect.makeTransparent().tolerance(18)\\n\\t.colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t))\\n\\t)\\n\\t.position(Position()\\n\\t.gravity(\\n\\tGravity.compass(\\n\\tCompass.southEast()))\\n\\t)\\n\\t)\\n\\t.videoEdit(VideoEdit.trim().duration(&#039;10.0&#039;)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;galaxy_spin.mp4\\&quot;)\\n\\t videoEdit(VideoEdit.trim() { startOffset(8.0F) })\\n\\t overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.4F)\\n\\t relative()\\n\\t })\\n\\t effect(Effect.makeTransparent() { tolerance(18)\\n\\t colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t }) })\\n\\t }) {\\n\\t position(Position() {\\n\\t gravity(\\n\\tGravity.compass(\\n\\tCompass.southEast()))\\n\\t })\\n\\t })\\n\\t videoEdit(VideoEdit.trim() { duration(10.0F) }) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;galaxy_spin.mp4\\&quot;)\\n\\t videoEdit(VideoEdit.trim() { startOffset(8.0F) })\\n\\t overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.4F)\\n\\t relative()\\n\\t })\\n\\t effect(Effect.makeTransparent() { tolerance(18)\\n\\t colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t }) })\\n\\t }) {\\n\\t position(Position() {\\n\\t gravity(\\n\\tGravity.compass(\\n\\tCompass.southEast()))\\n\\t })\\n\\t })\\n\\t videoEdit(VideoEdit.trim() { duration(10.0F) }) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;galaxy_spin\\&quot;, {transformation: [ {start_offset: \\&quot;8\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.4\\&quot;, flags: \\&quot;relative\\&quot;, gravity: \\&quot;south_east\\&quot;}, {duration: \\&quot;10\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;galaxy_spin\\&quot;, {transformation: [\\n  {start_offset: \\&quot;8\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:18\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.4\\&quot;, flags: \\&quot;relative\\&quot;, gravity: \\&quot;south_east\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;galaxy_spin.mp4\\&quot;)\\n  .videoEdit(trim().startOffset(\\&quot;8.0\\&quot;))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.4).relative())\\n          .effect(makeTransparent().tolerance(18).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south_east\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/so_8\\\/l_video:docs:talking_head_travel,e_make_transparent:18,co_rgb:5ec2c4,w_0.4,fl_relative,g_south_east\\\/du_10\\\/galaxy_spin.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;start_offset&quot;:&quot;8&quot;},{&quot;overlay&quot;:&quot;video:docs:talking_head_travel&quot;,&quot;effect&quot;:&quot;make_transparent:18&quot;,&quot;color&quot;:&quot;rgb:5ec2c4&quot;,&quot;width&quot;:&quot;0.4&quot;,&quot;flags&quot;:&quot;relative&quot;,&quot;gravity&quot;:&quot;south_east&quot;},{&quot;duration&quot;:&quot;10&quot;}],&quot;transformation_string&quot;:&quot;so_8\\\/l_video:docs:talking_head_travel,e_make_transparent:18,co_rgb:5ec2c4,w_0.4,fl_relative,g_south_east\\\/du_10&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;galaxy_spin.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><\/p>\n<p>We can even take advantage of other Cloudinary <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery\">video transformations<\/a>. For example, in this transformation URL, we added the fade out effect to the last two seconds of the overlay video, as the narrator presumably travels to his next surprise location\u2026<\/p>\n<p>Note the use of the <code>layer_apply<\/code> flag so that two different effects (<code>make_transparent<\/code> and <code>fade<\/code>) can be applied in separate components to the same overlay:<\/p>\n<video style=\"margin: 0 auto;display: block\" controls=\"controls\" preload=\"none\"  width=600 poster=\"https:\/\/res.cloudinary.com\/demo\/image\/upload\/q_auto,f_auto\/docs\/talkhead_venice_poster.jpg\">\n  <source srhttps:\/\/res.cloudinary.com\/demo\/video\/upload\/e_accelerate:-50,l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.7,fl_relative\/e_fade:-2000\/g_south,fl_layer_apply\/du_10\/venice_waters.webm\" type=\"video\/webm\">\n  <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/e_accelerate:-50\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.7,fl_relative\/e_fade:-2000\/g_south,fl_layer_apply\/du_10\/venice_waters.mp4\" type=\"video\/mp4\">\n  <source src=https:\/\/res.cloudinary.com\/demo\/video\/upload\/e_accelerate:-50\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.7,fl_relative\/e_fade:-2000\/g_south,fl_layer_apply\/du_10\/venice_waters.ogv\" type=\"video\/ogg\">\n<\/video>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;venice_waters\\&quot;, {transformation: [ {effect: \\&quot;accelerate:-50\\&quot;}, {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.7\\&quot;, flags: \\&quot;relative\\&quot;}, {effect: \\&quot;fade:-2000\\&quot;}, {gravity: \\&quot;south\\&quot;, flags: \\&quot;layer_apply\\&quot;}, {duration: \\&quot;10\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;venice_waters\\&quot;, {transformation: [\\n  {effect: \\&quot;accelerate:-50\\&quot;},\\n  {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.7\\&quot;, flags: \\&quot;relative\\&quot;},\\n  {effect: \\&quot;fade:-2000\\&quot;},\\n  {gravity: \\&quot;south\\&quot;, flags: \\&quot;layer_apply\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;venice_waters\\&quot; &gt; &lt;Transformation effect=\\&quot;accelerate:-50\\&quot; \\\/&gt; &lt;Transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.7\\&quot; flags=\\&quot;relative\\&quot; \\\/&gt; &lt;Transformation effect=\\&quot;fade:-2000\\&quot; \\\/&gt; &lt;Transformation gravity=\\&quot;south\\&quot; flags=\\&quot;layer_apply\\&quot; \\\/&gt; &lt;Transformation duration=\\&quot;10\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;venice_waters\\&quot; &gt;\\n\\t&lt;Transformation effect=\\&quot;accelerate:-50\\&quot; \\\/&gt;\\n\\t&lt;Transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.7\\&quot; flags=\\&quot;relative\\&quot; \\\/&gt;\\n\\t&lt;Transformation effect=\\&quot;fade:-2000\\&quot; \\\/&gt;\\n\\t&lt;Transformation gravity=\\&quot;south\\&quot; flags=\\&quot;layer_apply\\&quot; \\\/&gt;\\n\\t&lt;Transformation duration=\\&quot;10\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;venice_waters\\&quot; &gt; &lt;cld-transformation effect=\\&quot;accelerate:-50\\&quot; \\\/&gt; &lt;cld-transformation :overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.7\\&quot; flags=\\&quot;relative\\&quot; \\\/&gt; &lt;cld-transformation effect=\\&quot;fade:-2000\\&quot; \\\/&gt; &lt;cld-transformation gravity=\\&quot;south\\&quot; flags=\\&quot;layer_apply\\&quot; \\\/&gt; &lt;cld-transformation duration=\\&quot;10\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;venice_waters\\&quot; &gt;\\n\\t&lt;cld-transformation effect=\\&quot;accelerate:-50\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation :overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.7\\&quot; flags=\\&quot;relative\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation effect=\\&quot;fade:-2000\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation gravity=\\&quot;south\\&quot; flags=\\&quot;layer_apply\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation duration=\\&quot;10\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;venice_waters\\&quot; &gt; &lt;cl-transformation effect=\\&quot;accelerate:-50\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.7\\&quot; flags=\\&quot;relative\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation effect=\\&quot;fade:-2000\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation gravity=\\&quot;south\\&quot; flags=\\&quot;layer_apply\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation duration=\\&quot;10\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;venice_waters\\&quot; &gt;\\n\\t&lt;cl-transformation effect=\\&quot;accelerate:-50\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation overlay=\\&quot;video:docs:talking_head_travel\\&quot; effect=\\&quot;make_transparent:15\\&quot; color=\\&quot;#5ec2c4\\&quot; width=\\&quot;0.7\\&quot; flags=\\&quot;relative\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation effect=\\&quot;fade:-2000\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation gravity=\\&quot;south\\&quot; flags=\\&quot;layer_apply\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation duration=\\&quot;10\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;venice_waters&#039;, {transformation: [ {effect: \\&quot;accelerate:-50\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.7\\&quot;, flags: \\&quot;relative\\&quot;}, {effect: \\&quot;fade:-2000\\&quot;}, {gravity: \\&quot;south\\&quot;, flags: \\&quot;layer_apply\\&quot;}, {duration: \\&quot;10\\&quot;} ]}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;venice_waters&#039;, {transformation: [\\n  {effect: \\&quot;accelerate:-50\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.7\\&quot;, flags: \\&quot;relative\\&quot;},\\n  {effect: \\&quot;fade:-2000\\&quot;},\\n  {gravity: \\&quot;south\\&quot;, flags: \\&quot;layer_apply\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ]}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;venice_waters\\&quot;).video(transformation=[ {&#039;effect&#039;: \\&quot;accelerate:-50\\&quot;}, {&#039;overlay&#039;: \\&quot;video:docs:talking_head_travel\\&quot;, &#039;effect&#039;: \\&quot;make_transparent:15\\&quot;, &#039;color&#039;: \\&quot;#5ec2c4\\&quot;, &#039;width&#039;: \\&quot;0.7\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;}, {&#039;effect&#039;: \\&quot;fade:-2000\\&quot;}, {&#039;gravity&#039;: \\&quot;south\\&quot;, &#039;flags&#039;: \\&quot;layer_apply\\&quot;}, {&#039;duration&#039;: \\&quot;10\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;venice_waters\\&quot;).video(transformation=[\\n  {&#039;effect&#039;: \\&quot;accelerate:-50\\&quot;},\\n  {&#039;overlay&#039;: \\&quot;video:docs:talking_head_travel\\&quot;, &#039;effect&#039;: \\&quot;make_transparent:15\\&quot;, &#039;color&#039;: \\&quot;#5ec2c4\\&quot;, &#039;width&#039;: \\&quot;0.7\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;},\\n  {&#039;effect&#039;: \\&quot;fade:-2000\\&quot;},\\n  {&#039;gravity&#039;: \\&quot;south\\&quot;, &#039;flags&#039;: \\&quot;layer_apply\\&quot;},\\n  {&#039;duration&#039;: \\&quot;10\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;venice_waters.mp4&#039;))\\n\\t-&gt;effect(Effect::accelerate()-&gt;rate(-50))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.7)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;effect(Effect::makeTransparent()-&gt;tolerance(15)\\n\\t-&gt;colorToReplace(Color::rgb(\\&quot;5ec2c4\\&quot;))\\n\\t)\\n\\t-&gt;effect(Effect::fadeOut()-&gt;duration(2000)))\\n\\t)\\n\\t-&gt;position((new Position())\\n\\t-&gt;gravity(\\n\\tGravity::compass(\\n\\tCompass::south()))\\n\\t)\\n\\t)\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;duration(10.0));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;venice_waters.mp4&#039;))\\n\\t-&gt;effect(Effect::accelerate()-&gt;rate(-50))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::video(\\&quot;docs\\\/talking_head_travel\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.7)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;effect(Effect::makeTransparent()-&gt;tolerance(15)\\n\\t-&gt;colorToReplace(Color::rgb(\\&quot;5ec2c4\\&quot;))\\n\\t)\\n\\t-&gt;effect(Effect::fadeOut()-&gt;duration(2000)))\\n\\t)\\n\\t-&gt;position((new Position())\\n\\t-&gt;gravity(\\n\\tGravity::compass(\\n\\tCompass::south()))\\n\\t)\\n\\t)\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;duration(10.0));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;venice_waters\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array( array(\\&quot;effect\\&quot;=&gt;\\&quot;accelerate:-50\\&quot;), array(\\&quot;overlay\\&quot;=&gt;\\&quot;video:docs:talking_head_travel\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;make_transparent:15\\&quot;, \\&quot;color\\&quot;=&gt;\\&quot;#5ec2c4\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;0.7\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;), array(\\&quot;effect\\&quot;=&gt;\\&quot;fade:-2000\\&quot;), array(\\&quot;gravity\\&quot;=&gt;\\&quot;south\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;layer_apply\\&quot;), array(\\&quot;duration\\&quot;=&gt;\\&quot;10\\&quot;) )))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;venice_waters\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array(\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;accelerate:-50\\&quot;),\\n  array(\\&quot;overlay\\&quot;=&gt;\\&quot;video:docs:talking_head_travel\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;make_transparent:15\\&quot;, \\&quot;color\\&quot;=&gt;\\&quot;#5ec2c4\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;0.7\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;),\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;fade:-2000\\&quot;),\\n  array(\\&quot;gravity\\&quot;=&gt;\\&quot;south\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;layer_apply\\&quot;),\\n  array(\\&quot;duration\\&quot;=&gt;\\&quot;10\\&quot;)\\n  )))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().effect(\\&quot;accelerate:-50\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:15\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(0.7).flags(\\&quot;relative\\&quot;).chain() .effect(\\&quot;fade:-2000\\&quot;).chain() .gravity(\\&quot;south\\&quot;).flags(\\&quot;layer_apply\\&quot;).chain() .duration(\\&quot;10\\&quot;)).videoTag(\\&quot;venice_waters\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation()\\n  .effect(\\&quot;accelerate:-50\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:15\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(0.7).flags(\\&quot;relative\\&quot;).chain()\\n  .effect(\\&quot;fade:-2000\\&quot;).chain()\\n  .gravity(\\&quot;south\\&quot;).flags(\\&quot;layer_apply\\&quot;).chain()\\n  .duration(\\&quot;10\\&quot;)).videoTag(\\&quot;venice_waters\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;venice_waters\\&quot;, transformation: [ {effect: \\&quot;accelerate:-50\\&quot;}, {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: 0.7, flags: \\&quot;relative\\&quot;}, {effect: \\&quot;fade:-2000\\&quot;}, {gravity: \\&quot;south\\&quot;, flags: \\&quot;layer_apply\\&quot;}, {duration: \\&quot;10\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;venice_waters\\&quot;, transformation: [\\n  {effect: \\&quot;accelerate:-50\\&quot;},\\n  {overlay: \\&quot;video:docs:talking_head_travel\\&quot;, effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: 0.7, flags: \\&quot;relative\\&quot;},\\n  {effect: \\&quot;fade:-2000\\&quot;},\\n  {gravity: \\&quot;south\\&quot;, flags: \\&quot;layer_apply\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Effect(\\&quot;accelerate:-50\\&quot;).Chain() .Overlay(new Layer().PublicId(\\&quot;video:docs:talking_head_travel\\&quot;)).Effect(\\&quot;make_transparent:15\\&quot;).Color(\\&quot;#5ec2c4\\&quot;).Width(0.7).Flags(\\&quot;relative\\&quot;).Chain() .Effect(\\&quot;fade:-2000\\&quot;).Chain() .Gravity(\\&quot;south\\&quot;).Flags(\\&quot;layer_apply\\&quot;).Chain() .Duration(\\&quot;10\\&quot;)).BuildVideoTag(\\&quot;venice_waters\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation()\\n  .Effect(\\&quot;accelerate:-50\\&quot;).Chain()\\n  .Overlay(new Layer().PublicId(\\&quot;video:docs:talking_head_travel\\&quot;)).Effect(\\&quot;make_transparent:15\\&quot;).Color(\\&quot;#5ec2c4\\&quot;).Width(0.7).Flags(\\&quot;relative\\&quot;).Chain()\\n  .Effect(\\&quot;fade:-2000\\&quot;).Chain()\\n  .Gravity(\\&quot;south\\&quot;).Flags(\\&quot;layer_apply\\&quot;).Chain()\\n  .Duration(\\&quot;10\\&quot;)).BuildVideoTag(\\&quot;venice_waters\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;venice_waters.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;e_accelerate:-50\\\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.7,fl_relative\\\/e_fade:-2000\\\/g_south,fl_layer_apply\\\/du_10\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;venice_waters.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;e_accelerate:-50\\\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.7,fl_relative\\\/e_fade:-2000\\\/g_south,fl_layer_apply\\\/du_10\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setEffect(\\&quot;accelerate:-50\\&quot;).chain() .setOverlay(\\&quot;video:docs:talking_head_travel\\&quot;).setEffect(\\&quot;make_transparent:15\\&quot;).setColor(\\&quot;#5ec2c4\\&quot;).setWidth(0.7).setFlags(\\&quot;relative\\&quot;).chain() .setEffect(\\&quot;fade:-2000\\&quot;).chain() .setGravity(\\&quot;south\\&quot;).setFlags(\\&quot;layer_apply\\&quot;).chain() .setDuration(\\&quot;10\\&quot;)).generate(\\&quot;venice_waters.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation()\\n  .setEffect(\\&quot;accelerate:-50\\&quot;).chain()\\n  .setOverlay(\\&quot;video:docs:talking_head_travel\\&quot;).setEffect(\\&quot;make_transparent:15\\&quot;).setColor(\\&quot;#5ec2c4\\&quot;).setWidth(0.7).setFlags(\\&quot;relative\\&quot;).chain()\\n  .setEffect(\\&quot;fade:-2000\\&quot;).chain()\\n  .setGravity(\\&quot;south\\&quot;).setFlags(\\&quot;layer_apply\\&quot;).chain()\\n  .setDuration(\\&quot;10\\&quot;)).generate(\\&quot;venice_waters.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().effect(\\&quot;accelerate:-50\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:15\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(0.7).flags(\\&quot;relative\\&quot;).chain() .effect(\\&quot;fade:-2000\\&quot;).chain() .gravity(\\&quot;south\\&quot;).flags(\\&quot;layer_apply\\&quot;).chain() .duration(\\&quot;10\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;venice_waters.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation()\\n  .effect(\\&quot;accelerate:-50\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;)).effect(\\&quot;make_transparent:15\\&quot;).color(\\&quot;#5ec2c4\\&quot;).width(0.7).flags(\\&quot;relative\\&quot;).chain()\\n  .effect(\\&quot;fade:-2000\\&quot;).chain()\\n  .gravity(\\&quot;south\\&quot;).flags(\\&quot;layer_apply\\&quot;).chain()\\n  .duration(\\&quot;10\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;venice_waters.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;venice_waters.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;e_accelerate:-50\\\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.7,fl_relative\\\/e_fade:-2000\\\/g_south,fl_layer_apply\\\/du_10\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;venice_waters.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;e_accelerate:-50\\\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.7,fl_relative\\\/e_fade:-2000\\\/g_south,fl_layer_apply\\\/du_10\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;venice_waters.mp4\\&quot;)\\n\\t effect(Effect.accelerate() { rate(-50) })\\n\\t overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.7F)\\n\\t relative()\\n\\t })\\n\\t effect(Effect.makeTransparent() { tolerance(15)\\n\\t colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t })\\n\\t effect(Effect.fadeOut() { duration(2000) }) })\\n\\t }) {\\n\\t position(Position() {\\n\\t gravity(\\n\\tGravity.compass(\\n\\tCompass.south()))\\n\\t })\\n\\t })\\n\\t videoEdit(VideoEdit.trim() { duration(10.0F) }) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;venice_waters.mp4\\&quot;)\\n\\t effect(Effect.accelerate() { rate(-50) })\\n\\t overlay(Overlay.source(\\n\\tSource.video(\\&quot;docs\\\/talking_head_travel\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.7F)\\n\\t relative()\\n\\t })\\n\\t effect(Effect.makeTransparent() { tolerance(15)\\n\\t colorToReplace(Color.rgb(\\&quot;5ec2c4\\&quot;))\\n\\t })\\n\\t effect(Effect.fadeOut() { duration(2000) }) })\\n\\t }) {\\n\\t position(Position() {\\n\\t gravity(\\n\\tGravity.compass(\\n\\tCompass.south()))\\n\\t })\\n\\t })\\n\\t videoEdit(VideoEdit.trim() { duration(10.0F) }) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;venice_waters\\&quot;, {transformation: [ {effect: \\&quot;accelerate:-50\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.7\\&quot;, flags: \\&quot;relative\\&quot;}, {effect: \\&quot;fade:-2000\\&quot;}, {gravity: \\&quot;south\\&quot;, flags: \\&quot;layer_apply\\&quot;}, {duration: \\&quot;10\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;venice_waters\\&quot;, {transformation: [\\n  {effect: \\&quot;accelerate:-50\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;video:docs:talking_head_travel\\&quot;), effect: \\&quot;make_transparent:15\\&quot;, color: \\&quot;#5ec2c4\\&quot;, width: \\&quot;0.7\\&quot;, flags: \\&quot;relative\\&quot;},\\n  {effect: \\&quot;fade:-2000\\&quot;},\\n  {gravity: \\&quot;south\\&quot;, flags: \\&quot;layer_apply\\&quot;},\\n  {duration: \\&quot;10\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;venice_waters.mp4\\&quot;)\\n  .effect(accelerate().rate(-50))\\n  .overlay(\\n    source(\\n      video(\\&quot;docs\\\/talking_head_travel\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.7).relative())\\n          .effect(makeTransparent().tolerance(15).colorToReplace(\\&quot;#5ec2c4\\&quot;))\\n          .effect(fadeOut().duration(2000))\\n      )\\n    ).position(new Position().gravity(compass(\\&quot;south\\&quot;)))\\n  )\\n  .videoEdit(trim().duration(\\&quot;10.0\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/e_accelerate:-50\\\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.7,fl_relative\\\/e_fade:-2000\\\/g_south,fl_layer_apply\\\/du_10\\\/venice_waters.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;effect&quot;:&quot;accelerate:-50&quot;},{&quot;overlay&quot;:&quot;video:docs:talking_head_travel&quot;,&quot;effect&quot;:&quot;make_transparent:15&quot;,&quot;color&quot;:&quot;rgb:5ec2c4&quot;,&quot;width&quot;:&quot;0.7&quot;,&quot;flags&quot;:&quot;relative&quot;},{&quot;effect&quot;:&quot;fade:-2000&quot;},{&quot;gravity&quot;:&quot;south&quot;,&quot;flags&quot;:&quot;layer_apply&quot;},{&quot;duration&quot;:&quot;10&quot;}],&quot;transformation_string&quot;:&quot;e_accelerate:-50\\\/l_video:docs:talking_head_travel,e_make_transparent:15,co_rgb:5ec2c4,w_0.7,fl_relative\\\/e_fade:-2000\\\/g_south,fl_layer_apply\\\/du_10&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;venice_waters.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><\/p>\n<h2>Need Video Transparency? We\u2019ve Got it Covered!<\/h2>\n<p>Whether you want to post a Killer Queen video outfit in seconds, or you need to remove a solid background from a talking head video or live product demo, Cloudinary\u2019s green screen transparency effect makes it quick and easy. For more details on this and other effects you can apply to your Cloudinary videos, see the <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery#video_effects\">video effects<\/a> documentation in the <em>Video Transformations Guide<\/em>.<\/p>\n<p>Once you\u2019ve got your cool video transparency effect ready to go, you can easily embed it in your web or mobile site using the <a href=\"https:\/\/cloudinary.com\/documentation\/cloudinary_video_player\">Cloudinary video player<\/a>, which offers <a href=\"https:\/\/cloudinary.com\/guides\/video\/how-can-you-use-responsive-video\">responsive video<\/a> display for any device, built-in adaptive bitmap streaming, customizable color themes, floating player support, and more.<\/p>\n<p>This dynamic video transparency feature is too much fun not to try it yourself. If you haven\u2019t used Cloudinary before, <a href=\"https:\/\/cloudinary.com\/users\/register\/free\">register for a free account<\/a>, upload some videos, and share your creations in the comments. We can\u2019t wait to see what you come up with!<\/p>\n<hr \/>\n<h2>Further Reading on Video Manipulation<\/h2>\n<ul>\n<li>\n<a href=\"https:\/\/cloudinary.com\/video_api\">Video Transcoding\nand Manipulation<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/top_10_mistakes_in_handling_website_videos_and_how_to_solve_them\">Top 10 Mistakes in Handling Website Videos and How to Solve Them<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/how_to_automate_compression_of_video_files_with_one_line_of_code\">How to Compress Video Size Automatically With One Line of Code<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/exoplayer_android_tutorial_easy_video_delivery_and_editing\">ExoPlayer Android Tutorial: Easy Video Delivery and Editing<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/html5_video_player\">Ultimate HTML5 Video Player Showdown: 10 Players Compared<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/how_to_generate_waveform_images_from_audio_files\">How to Generate Waveform Images From Audio Files<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/with_automatic_video_subtitles_silence_speaks_volumes\">Auto Generate Subtitles Based on Video Transcript<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/auto_generate_video_previews_with_great_results_every_time\">Auto-Generate Video Previews with Great Results Every Time<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/html5_video_tags_won_t_do_for_your_videos\">Adaptive HLS Streaming Using the HTML5 Video Tag<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/optimizing_video_with_cloudinary_and_the_html5_video_player_part_1\">Video Optimization With the HTML5 &lt;\\video&gt; Player<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/converting_android_videos_to_animated_gif_images_with_cloudinary_a_tutorial\">Converting Android Videos to Animated GIF Images With Cloudinary: A Tutorial<\/a>\n<\/li>\n<\/ul>\n<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":41,"featured_media":21922,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_cloudinary_featured_overwrite":false,"footnotes":""},"categories":[1],"tags":[97,303,305,304],"class_list":["post-21921","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","tag-dynamic-video","tag-video","tag-video-api","tag-video-transformation"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.6 (Yoast SEO v26.9) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Green Screen Queen: Dynamic Video Transparency Fit For Royalty<\/title>\n<meta name=\"description\" content=\"With one line of code, you can remove any solid color from an overlay video to auto-generate and deliver dynamic video with green-screen transparency.\" \/>\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\/green_screen_queen_dynamic_video_transparency_fit_for_royalty\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Green Screen Queen: Dynamic Video Transparency Fit For Royalty\" \/>\n<meta property=\"og:description\" content=\"With one line of code, you can remove any solid color from an overlay video to auto-generate and deliver dynamic video with green-screen transparency.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty\" \/>\n<meta property=\"og:site_name\" content=\"Cloudinary Blog\" \/>\n<meta property=\"article:published_time\" content=\"2022-02-26T20:10:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-11-01T13:14:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.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\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#article\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty\"},\"author\":{\"name\":\"\",\"@id\":\"\"},\"headline\":\"Green Screen Queen: Dynamic Video Transparency Fit For Royalty\",\"datePublished\":\"2022-02-26T20:10:00+00:00\",\"dateModified\":\"2025-11-01T13:14:46+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty\"},\"wordCount\":9,\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA\",\"keywords\":[\"Dynamic Video\",\"Video\",\"Video API\",\"Video Transformation\"],\"inLanguage\":\"en-US\",\"copyrightYear\":\"2022\",\"copyrightHolder\":{\"@id\":\"https:\/\/cloudinary.com\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty\",\"url\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty\",\"name\":\"Green Screen Queen: Dynamic Video Transparency Fit For Royalty\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#primaryimage\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA\",\"datePublished\":\"2022-02-26T20:10:00+00:00\",\"dateModified\":\"2025-11-01T13:14:46+00:00\",\"description\":\"With one line of code, you can remove any solid color from an overlay video to auto-generate and deliver dynamic video with green-screen transparency.\",\"breadcrumb\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#primaryimage\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA\",\"width\":2000,\"height\":1100},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/cloudinary.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Green Screen Queen: Dynamic Video Transparency Fit For Royalty\"}]},{\"@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":"Green Screen Queen: Dynamic Video Transparency Fit For Royalty","description":"With one line of code, you can remove any solid color from an overlay video to auto-generate and deliver dynamic video with green-screen transparency.","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\/green_screen_queen_dynamic_video_transparency_fit_for_royalty","og_locale":"en_US","og_type":"article","og_title":"Green Screen Queen: Dynamic Video Transparency Fit For Royalty","og_description":"With one line of code, you can remove any solid color from an overlay video to auto-generate and deliver dynamic video with green-screen transparency.","og_url":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty","og_site_name":"Cloudinary Blog","article_published_time":"2022-02-26T20:10:00+00:00","article_modified_time":"2025-11-01T13:14:46+00:00","og_image":[{"width":2000,"height":1100,"url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA","type":"image\/jpeg"}],"twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"NewsArticle","@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#article","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty"},"author":{"name":"","@id":""},"headline":"Green Screen Queen: Dynamic Video Transparency Fit For Royalty","datePublished":"2022-02-26T20:10:00+00:00","dateModified":"2025-11-01T13:14:46+00:00","mainEntityOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty"},"wordCount":9,"publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA","keywords":["Dynamic Video","Video","Video API","Video Transformation"],"inLanguage":"en-US","copyrightYear":"2022","copyrightHolder":{"@id":"https:\/\/cloudinary.com\/#organization"}},{"@type":"WebPage","@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty","url":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty","name":"Green Screen Queen: Dynamic Video Transparency Fit For Royalty","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#primaryimage"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA","datePublished":"2022-02-26T20:10:00+00:00","dateModified":"2025-11-01T13:14:46+00:00","description":"With one line of code, you can remove any solid color from an overlay video to auto-generate and deliver dynamic video with green-screen transparency.","breadcrumb":{"@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#primaryimage","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA","width":2000,"height":1100},{"@type":"BreadcrumbList","@id":"https:\/\/cloudinary.com\/blog\/green_screen_queen_dynamic_video_transparency_fit_for_royalty#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cloudinary.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Green Screen Queen: Dynamic Video Transparency Fit For Royalty"}]},{"@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\/v1649721069\/Web_Assets\/blog\/green_screen_video_effects\/green_screen_video_effects.jpg?_i=AA","_links":{"self":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21921","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=21921"}],"version-history":[{"count":8,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21921\/revisions"}],"predecessor-version":[{"id":39066,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21921\/revisions\/39066"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media\/21922"}],"wp:attachment":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media?parent=21921"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/categories?post=21921"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/tags?post=21921"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}