{"id":39683,"date":"2021-12-06T10:00:00","date_gmt":"2021-12-06T15:00:00","guid":{"rendered":"https:\/\/www.litmus.com\/?p=39683"},"modified":"2025-12-18T16:37:35","modified_gmt":"2025-12-18T21:37:35","slug":"gmail-changing-gif-color","status":"publish","type":"post","link":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color","title":{"rendered":"Color Me Gmail: Solve for Gmail\u2019s Image Proxy Changing the Colors of Your GIFs"},"content":{"rendered":"\n\n\t<div id=\"simple-text-block-block_1debbc6c4ba2b95da216a53175d439c2\" class=\"block-simple-text-block alignfull \" style=\"background-color:\">\n  <div class=\"container\">\n  \t<div class=\"row\">\n  \t\t<div class=\"col\">\n  \t\t\t<div class=\"copy\">\n  \t\t\t\t<p>Recently, we\u2019ve heard rumblings from email geeks asking \u201cWhy is my GIF showing up with different colors in Gmail?\u201d As we haven\u2019t seen this issue with our GIFs at Litmus, we were wondering why our GIFs seem to have escaped this quirk and how we could help other email geeks avoid it. So let&#8217;s dive in and share what we found.<\/p>\n<ul>\n<li aria-level=\"1\"><a rel=\"noopener\" href=\"#why\">Why Gmail changes the colors of your GIFs<\/a><\/li>\n<li aria-level=\"1\"><a rel=\"noopener\" href=\"#what\">What is happening to your GIFs (with examples)<\/a><\/li>\n<li aria-level=\"1\"><a rel=\"noopener\" href=\"#how\">How to fix Gmail changing the colors of your GIF<\/a><\/li>\n<\/ul>\n<h2 id=\"why\">Why, Gmail, why?!<\/h2>\n<p>Our first question was the obvious, \u201cWhy?\u201d The simple answer is that Gmail has been having issues with images <a rel=\"noopener\" href=\"https:\/\/www.litmus.com\/blog\/gmail-adds-image-caching-what-you-need-to-know\/\" target=\"_blank\" rel=\"noopener\">since they started caching images<\/a> using a proxy server back in 2013. Though the color changing may not have been one of those issues, some of those issues have been addressed (like an issue with GIFs being compressed incorrectly when they included text). However, this color changing one doesn\u2019t seem to have been addressed yet.<\/p>\n<p>But what specifically is happening? Well, from what we can determine, when Gmail caches an image on it\u2019s proxy servers, it runs the images through a compressor which cuts colors out of the color table for GIFs. This results in some GIFs changing colors. We\u2019ll go into the specifics later in this article, but that\u2019s the basics of why your GIF is changing colors. When a color is cut out, the GIF will replace it with one of the colors that\u2019s left in the color table that is closest to the original color.<\/p>\n<h2 id=\"what\">A needle in a haystack<\/h2>\n<p>One of the first things we discovered, and probably why this issue hasn\u2019t been fixed yet, is that it\u2019s rather difficult to recreate. So if you find your images changing colors then consider yourself lucky\u2026 well maybe not lucky, but you are in the minority.<\/p>\n<p>The lovely <a rel=\"noopener\" href=\"https:\/\/www.litmus.com\/blog\/?contributor=651\" target=\"_blank\" rel=\"noopener\">Lily Worth<\/a> created a couple of different GIFs for us to test, and none of them visibly changed colors. But upon further inspection, all of them had colors removed from their color table by Gmail.<\/p>\n<p>With these simple GIFs:<\/p>\n<img decoding=\"async\" class=\"alignnone wp-image-39687\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/cat-conveyer.gif\" alt=\"GIF of cats on conveyer belt, before Gmail\" width=\"600\" height=\"250\" \/>\n<img decoding=\"async\" class=\"alignnone wp-image-39692\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/color-cats.gif\" alt=\"GIF of cats, before Gmail\" width=\"500\" height=\"208\" \/>\n<p>Gmail removed 24 and 19 colors respectively which resulted in the GIFs looking like this:<\/p>\n<img decoding=\"async\" class=\"alignnone size-full wp-image-39756\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/cat-conveyer-gif-after-gmail.gif\" alt=\"cat conveyer GIF, after Gmail\" width=\"600\" height=\"250\" \/>\n<img decoding=\"async\" class=\"alignnone size-full wp-image-39757\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/cat-gif-after-gmail.gif\" alt=\"cat GIF, after Gmail\" width=\"500\" height=\"208\" \/>\n<p>Not a difference that you can see. And this is the case with most of the GIFs that Litmus creates. We don\u2019t see a visible difference between the original version and the Gmail version, even when colors are removed, which is probably what Gmail is going for.<\/p>\n<p>However, in some cases, the color that is removed is a very crucial color. As seen in these GIFs from Tiffani Davidson at <a rel=\"noopener\" target=\"_blank\" href=\"https:\/\/www.thimble.com\/\" target=\"_blank\" rel=\"noopener\">Thimble<\/a>.\u00a0The original GIF has 127 colors.<\/p>\n<img decoding=\"async\" class=\"alignnone size-full wp-image-39695\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/nurture-email-1200-v32.gif\" alt=\"nurture-email-1200-v32\" width=\"800\" height=\"180\" \/>\n<p>The Gmail version has 125 colors, only a difference of two colors. However, one of those colors that Gmail removed was white, which resulted in the GIF appearing in the email with a very faint green-tinged background instead of the white:<\/p>\n<img decoding=\"async\" class=\"alignnone size-full wp-image-39694\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/nurture-email-vGreen.gif\" alt=\"nurture-email-vGreen\" width=\"800\" height=\"180\" \/>\n<p>If that color had been a small part of the GIF animation, then it wouldn\u2019t have been noticeable. However, it was a major background component and so it is very obvious in the email.<\/p>\n<p>Another place where the color changing was more obvious was when gradients were used. To test this, we added gradients to our initial GIFs. Here are the two GIFs with smooth background gradients:<\/p>\n<img decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/cats-conveyer-256.gif\" alt=\"cat conveyer GIF with gradient\" width=\"1200\" height=\"500\" \/>\n<img decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/color-cats-256.gif\" alt=\"cat GIF with gradient\" width=\"1200\" height=\"500\" \/>\n<p>However, once these have been put through the Gmail proxy, the gradients are a bit more choppy. If you look closely, colors have been removed and the gradients now have lines between them.<\/p>\n<img decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/cats-conveyer-256-gmail.gif\" alt=\"cat conveyer GIF with gradient, after going through Gmail proxy\" width=\"1200\" height=\"500\" \/>\n<img decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/color-cats-256-gmail.gif\" alt=\"cat GIF with gradient, after going through Gmail proxy\" width=\"1200\" height=\"500\" \/>\n<p>In the above GIFs, Gmail removed 60 colors in the cat conveyor belt, but only 6 colors in the color changing cats.<\/p>\n<p>This is the most common version of Gmail dropping colors that we\u2019ve noticed in our emails. A recent email that we sent had a smooth gradient everywhere except in Gmail as seen here:<\/p>\n  \t\t\t<\/div>\n  \t\t<\/div>\n  \t<\/div>\n  <\/div>\n<\/div>\n\n\n\n<div id=\"text-two-columns-block_f407e8c1ee0a5d37b0805c195c1c857f\" class=\"block-text-two-columns alignfull\" style=\"background-color:\">\n  <div class=\"container\">\n      \t<div class=\"row \">\n  \t\t<div class=\"col-md-6 column\">\n        <div class=\"\">\n          <p>Original animation<\/p>\n<img decoding=\"async\" class=\"alignnone size-full wp-image-39761\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/litmus-coin-gif.gif\" alt=\"coin GIF\" width=\"1200\" height=\"700\" \/>\n        <\/div>\n  \t\t<\/div>\n      <div class=\"col-md-6 column\">\n        <div class=\"\">\n         <p>Gmail version of the animation<\/p>\n<img decoding=\"async\" class=\"alignnone size-full wp-image-39762\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/litmus-coin-gif-after-gmail.gif\" alt=\"coin GIF after Gmail\" width=\"1200\" height=\"700\" \/>\n                 <\/div>\n      <\/div>\n  \t<\/div>\n  <\/div>\n<\/div>\n\n\n\n\n\t<div id=\"simple-text-block-block_12803fe1ed04edf8fd9b4442c7e31ac7\" class=\"block-simple-text-block alignfull \" style=\"background-color:\">\n  <div class=\"container\">\n  \t<div class=\"row\">\n  \t\t<div class=\"col\">\n  \t\t\t<div class=\"copy\">\n  \t\t\t\t<p>The original version has 256 colors, where the Gmail version has 131. That\u2019s a whopping 125 colors removed by Gmail and results in those very obvious lines through the gradient background in the animation.<\/p>\n<p>In most of the above cases, the reduction of the color table results in smaller image sizes, so our guess is that Gmail is trying to optimize the images a little in an effort to make sure the files are as small as possible. However, in the case of Tiffani\u2019s image, the Gmail version actually has a larger file size, so maybe there\u2019s some other goal that Gmail is trying to achieve. Possibly the color table changes are just an artifact of Gmail scanning the images for security purposes. Either way, we may never know\u2014but what we <i>do<\/i> know is that since Gmail is reducing the color tables, we have something we can do to try and solve the issue.<\/p>\n<h2 id=\"how\">How to get your GIFs back to looking amazing<\/h2>\n<p>As you can see, there are lots of ways that Gmail can mess up your GIFs, so there are several things you can do.<\/p>\n<p>If the color shift is subtle, such as with the cat GIFs above, you can get away with doing nothing. But if your color shift is obvious, such as with Tiffani\u2019s GIF, then you should consider exploring other options:.<\/p>\n<h3>Resave your GIF<\/h3>\n<p>The next solution is to resave your GIF with less colors in the color table. This allows you a bit more control over how the image is optimized. When you save your GIF with a smaller color table, there are less colors for Gmail to cut out. Essentially you\u2019re telling Gmail which colors are the most important for your image.<\/p>\n<p>Knowing that Gmail may add artifacts and remove colors, you can save your GIF at different color tables (32, 64, 128, and 256). Then, you can <a rel=\"noopener\" href=\"https:\/\/www.litmus.com\/email-testing\/\" target=\"_blank\" rel=\"noopener\">test your emails in Litmus<\/a> to find out which GIF looks good in Gmail without sacrificing the look in other email clients.<\/p>\n<p>In some cases you\u2019ll be able to stay pretty close to the original. Here are different versions of an animation saved at 256, 128, 64, and 32 colors from top to bottom, as seen in Gmail:<\/p>\n<p><iframe class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" title=\"animation_versions Video\" src=\"https:\/\/fast.wistia.net\/embed\/iframe\/nfoz5ws9zq?dnt=1#?secret=f10IPLrUCq\" data-secret=\"f10IPLrUCq\" frameborder=\"0\" scrolling=\"no\" width=\"500\" height=\"544\"><\/iframe><\/p>\n<p>In this case, everything shows up with the lines through the gradient, but the 128 color version is slightly better than the other versions.<\/p>\n<p>But in some cases, you\u2019ll have to go down to 32 colors:<\/p>\n<figure id=\"attachment_39771\" aria-describedby=\"caption-attachment-39771\" style=\"width: 700px\" class=\"wp-caption alignnone\"><img decoding=\"async\" class=\"wp-image-39771 size-full\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/animations-variations-labels-.png\" alt=\"animations variations with labels\" width=\"700\" height=\"579\" srcset=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/animations-variations-labels-.png 700w, https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/animations-variations-labels--300x248.png 300w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><figcaption id=\"caption-attachment-39771\" class=\"wp-caption-text\">Different versions of an animation saved at 256, 128, 64, and 32 colors from top to bottom as seen in Gmail<\/figcaption><\/figure>\n<p>In this case, the light green background stays until the animation is saved at 32 colors.<\/p>\n<h3>Blend modes<\/h3>\n<p>This option is a little more technical, but if you don\u2019t have the original GIF or a way to resave the GIF, this option could work in some cases. Remi Parmentier brought <a rel=\"noopener\" target=\"_blank\" href=\"https:\/\/www.hteumeuleu.com\/2021\/fixing-gmail-dark-mode-css-blend-modes\/\" target=\"_blank\" rel=\"noopener\">CSS blend modes<\/a> to my attention as a fix for keeping text light in Gmail apps, but he pointed out it would work in this case as well.<\/p>\n<p>CSS blend modes are used to calculate how an element\u2019s color mixes with the color of the element\u2019s parent. Simply put, you can use blend modes in CSS to alter how colors behave. In this case, we use the mix-blend-mode CSS property, and the <a rel=\"noopener\" target=\"_blank\" href=\"https:\/\/drafts.fxtf.org\/compositing-1\/#valdef-blend-mode-difference\" target=\"_blank\" rel=\"noopener\">difference blend mode<\/a>. First we\u2019ll set up the class, and we\u2019ll target it with <code>u + .body<\/code> so that it only occurs in Gmail:<\/p>\n  \t\t\t<\/div>\n  \t\t<\/div>\n  \t<\/div>\n  <\/div>\n<\/div>\n\n\n\n<pre class=\"wp-block-syntaxhighlighter-code\">&lt;style>\n    u+.body .gmail-difference { mix-blend-mode:difference; }\n&lt;\/style><\/pre>\n\n\n\n\n\t<div id=\"simple-text-block-block_e47919bab84fac43a6ba39d04d724686\" class=\"block-simple-text-block alignfull \" style=\"background-color:\">\n  <div class=\"container\">\n  \t<div class=\"row\">\n  \t\t<div class=\"col\">\n  \t\t\t<div class=\"copy\">\n  \t\t\t\t<p>Then, we\u2019ll wrap the animation with a span. We\u2019ll add a background color and have the span be a block element to ensure the background is behind the entire animation:<\/p>\n  \t\t\t<\/div>\n  \t\t<\/div>\n  \t<\/div>\n  <\/div>\n<\/div>\n\n\n\n<pre class=\"wp-block-syntaxhighlighter-code\">&lt;span style=\"display: inline-block;background-color: #f6fffc;\">\n&lt;img src=\"animation.gif\" height=\"135\" width=\"600\" \/>\n&lt;\/span><\/pre>\n\n\n\n\n\t<div id=\"simple-text-block-block_c01efa31c6c8e2216a586d258784aaff\" class=\"block-simple-text-block alignfull \" style=\"background-color:\">\n  <div class=\"container\">\n  \t<div class=\"row\">\n  \t\t<div class=\"col\">\n  \t\t\t<div class=\"copy\">\n  \t\t\t\t<p>The background color we used here is the light green that Gmail is converting the white background to.<\/p>\n<p>Next, we add the class. And here\u2019s the tricky part: We add the class to <i>both <\/i>the span and the image.<\/p>\n  \t\t\t<\/div>\n  \t\t<\/div>\n  \t<\/div>\n  <\/div>\n<\/div>\n\n\n\n<pre class=\"wp-block-syntaxhighlighter-code\">&lt;span class=\"gmail-blend-difference\" style=\"display: inline-block;background-color: #f6fffc;\">\n&lt;img class=\"gmail-blend-difference\" src=\"animation.gif\" height=\"135\" width=\"600\" \/>\n&lt;\/span><\/pre>\n\n\n\n\n\t<div id=\"simple-text-block-block_7d6b0e79718ae8d96d8d40244c67a4f3\" class=\"block-simple-text-block alignfull \" style=\"background-color:\">\n  <div class=\"container\">\n  \t<div class=\"row\">\n  \t\t<div class=\"col\">\n  \t\t\t<div class=\"copy\">\n  \t\t\t\t<p>When we add the class to the span, the background color becomes the difference between the light green and white:<\/p>\n<figure id=\"attachment_39772\" aria-describedby=\"caption-attachment-39772\" style=\"width: 804px\" class=\"wp-caption alignnone\"><img decoding=\"async\" class=\"size-full wp-image-39772\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes-backgrounds.png\" alt=\"image blend modes backgrounds\" width=\"804\" height=\"444\" srcset=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes-backgrounds.png 804w, https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes-backgrounds-300x166.png 300w, https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes-backgrounds-768x424.png 768w, https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes-backgrounds-700x387.png 700w\" sizes=\"(max-width: 804px) 100vw, 804px\" \/><figcaption id=\"caption-attachment-39772\" class=\"wp-caption-text\"><i>The background colors behind the animations as shown in Gmail with images turned off. The top one has the blend mode applied the bottom one does not.<\/i><\/figcaption><\/figure>\n<p>The result? When we add the image on top, that dark background color is blended with the light green of the image to bring it back to white:<\/p>\n<figure id=\"attachment_39773\" aria-describedby=\"caption-attachment-39773\" style=\"width: 820px\" class=\"wp-caption alignnone\"><img decoding=\"async\" class=\"size-full wp-image-39773\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes.png\" alt=\"image blend modes\" width=\"820\" height=\"446\" srcset=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes.png 820w, https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes-300x163.png 300w, https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes-768x418.png 768w, https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/image-blend-modes-700x381.png 700w\" sizes=\"(max-width: 820px) 100vw, 820px\" \/><figcaption id=\"caption-attachment-39773\" class=\"wp-caption-text\"><i>The animations as shown in Gmail with blend modes. The top one has the blend mode applied the bottom one does not.<\/i><\/figcaption><\/figure>\n<p>There\u2019s a technical formula for how the blend mode works, which <a rel=\"noopener\" target=\"_blank\" href=\"https:\/\/drafts.fxtf.org\/compositing-1\/#generalformula\" target=\"_blank\" rel=\"noopener\">Remi goes into<\/a> and provides further blogs if you want to fall down a (very interesting) rabbit hole. But what it boils down to is:<\/p>\n<p><strong>White background &#8211; light green background &#8211; light green background = white background<\/strong><\/p>\n<p>Which makes a lot more sense than me trying to explain it with numbers and equations.<\/p>\n<p>This solution only works if Gmail is changing the white color in your animation and your animation is sitting on a white background. If there\u2019s another color being changed or a gradient being changed, then you\u2019ll have to fall back to resaving your image\u2014but it\u2019s a great quick fix to keep in your back pocket for when you need it.<\/p>\n<h2>Get your GIF on<\/h2>\n<p>So there you have it. Maybe not the most satisfying solution as to why Gmail is wreaking havoc on your images, but at least you can be the email hero and offer solutions the next time you see your images showing up weirdly in Gmail. And the best way to be an email hero? Make sure to <a rel=\"noopener\" href=\"https:\/\/www.litmus.com\/email-testing\/\" target=\"_blank\" rel=\"noopener\">test your emails in Litmus<\/a> before you send so you can catch those image issues and ensure your emails are looking their best when they hit your subscribers\u2019 inboxes.<\/p>\n<p>Want more on GIFs? Check out our <a rel=\"noopener\" href=\"https:\/\/www.litmus.com\/blog\/a-guide-to-animated-gifs-in-email\/\" target=\"_blank\" rel=\"noopener\">guide to animated GIFs in email<\/a>.<\/p>\n<div class=\"cta\">\n<table style=\"background-color: #f2f3f6;\">\n<tbody>\n<tr>\n<td class=\"block-1\" style=\"padding: 20px 10px 20px 20px;\"><img decoding=\"async\" class=\"alignnone size-full wp-image-4104\" src=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2020\/04\/logo.png\" alt=\"Litmus logo\" width=\"140\" height=\"165\" \/><\/td>\n<td class=\"block-2\" style=\"padding: 20px 20px 20px 10px;\">\n<p class=\"zero\"><strong>Ensure a great subscriber experience<br \/>\n<\/strong><\/p>\n<p class=\"zero\">Test your emails in 90+ email clients, apps, and devices. And send on-brand, error-free emails. Every time.<\/p>\n<p class=\"zero\"><a class=\"btn medium orange button\" rel=\"noopener\" href=\"https:\/\/www.litmus.com\/email-testing\/\" target=\"_blank\" rel=\"noopener noreferrer\">Book a demo<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<p>&nbsp;<\/p>\n  \t\t\t<\/div>\n  \t\t<\/div>\n  \t<\/div>\n  <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Learn how to solve for Gmail\u2019s image -proxy changing the colors of your GIFs.<\/p>\n","protected":false},"author":25,"featured_media":39684,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"tags":[240,106],"blog_category":[53],"class_list":["post-39683","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-animated-gif","tag-gmail","blog_category-tips-resources"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.5 (Yoast SEO v27.7) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Gmail Changing Your GIF Color? Here\u2019s How to Fix That - Litmus<\/title>\n<meta name=\"description\" content=\"Learn how to solve for Gmail\u2019s image -proxy changing the colors of your GIFs.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Color Me Gmail: Solve for Gmail\u2019s Image Proxy Changing the Colors of Your GIFs\" \/>\n<meta property=\"og:description\" content=\"Learn how to solve for Gmail\u2019s image -proxy changing the colors of your GIFs.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color\" \/>\n<meta property=\"og:site_name\" content=\"Litmus\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/litmusapp\" \/>\n<meta property=\"article:published_time\" content=\"2021-12-06T15:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-12-18T21:37:35+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/How-to-fix-gmail-changing-the-color-of-your-gif2.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1380\" \/>\n\t<meta property=\"og:image:height\" content=\"725\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@litmusapp\" \/>\n<meta name=\"twitter:site\" content=\"@litmusapp\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Gmail Changing Your GIF Color? Here\u2019s How to Fix That - Litmus","description":"Learn how to solve for Gmail\u2019s image -proxy changing the colors of your GIFs.","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:\/\/www.litmus.com\/blog\/gmail-changing-gif-color","og_locale":"en_US","og_type":"article","og_title":"Color Me Gmail: Solve for Gmail\u2019s Image Proxy Changing the Colors of Your GIFs","og_description":"Learn how to solve for Gmail\u2019s image -proxy changing the colors of your GIFs.","og_url":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color","og_site_name":"Litmus","article_publisher":"https:\/\/www.facebook.com\/litmusapp","article_published_time":"2021-12-06T15:00:00+00:00","article_modified_time":"2025-12-18T21:37:35+00:00","og_image":[{"width":1380,"height":725,"url":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/How-to-fix-gmail-changing-the-color-of-your-gif2.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_creator":"@litmusapp","twitter_site":"@litmusapp","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color#article","isPartOf":{"@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color"},"author":{"name":"","@id":""},"headline":"Color Me Gmail: Solve for Gmail\u2019s Image Proxy Changing the Colors of Your GIFs","datePublished":"2021-12-06T15:00:00+00:00","dateModified":"2025-12-18T21:37:35+00:00","mainEntityOfPage":{"@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color"},"wordCount":15,"publisher":{"@id":"https:\/\/www.litmus.com\/#organization"},"image":{"@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color#primaryimage"},"thumbnailUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/How-to-fix-gmail-changing-the-color-of-your-gif2.png","keywords":["Animated Gif","Gmail"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color","url":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color","name":"Gmail Changing Your GIF Color? Here\u2019s How to Fix That - Litmus","isPartOf":{"@id":"https:\/\/www.litmus.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color#primaryimage"},"image":{"@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color#primaryimage"},"thumbnailUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/How-to-fix-gmail-changing-the-color-of-your-gif2.png","datePublished":"2021-12-06T15:00:00+00:00","dateModified":"2025-12-18T21:37:35+00:00","description":"Learn how to solve for Gmail\u2019s image -proxy changing the colors of your GIFs.","breadcrumb":{"@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color#primaryimage","url":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/How-to-fix-gmail-changing-the-color-of-your-gif2.png","contentUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2021\/12\/How-to-fix-gmail-changing-the-color-of-your-gif2.png","width":1380,"height":725},{"@type":"BreadcrumbList","@id":"https:\/\/www.litmus.com\/blog\/gmail-changing-gif-color#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.litmus.com\/"},{"@type":"ListItem","position":2,"name":"Color Me Gmail: Solve for Gmail\u2019s Image Proxy Changing the Colors of Your GIFs"}]},{"@type":"WebSite","@id":"https:\/\/www.litmus.com\/#website","url":"https:\/\/www.litmus.com\/","name":"Litmus","description":"Are you getting the most out of your email marketing?","publisher":{"@id":"https:\/\/www.litmus.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.litmus.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.litmus.com\/#organization","name":"Litmus Software","url":"https:\/\/www.litmus.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.litmus.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.litmus.com\/wp-content\/uploads\/2025\/04\/featured-image.png","contentUrl":"https:\/\/www.litmus.com\/wp-content\/uploads\/2025\/04\/featured-image.png","width":600,"height":314,"caption":"Litmus Software"},"image":{"@id":"https:\/\/www.litmus.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/litmusapp","https:\/\/x.com\/litmusapp"]},{"@type":"Person","@id":""}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts\/39683","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/users\/25"}],"replies":[{"embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/comments?post=39683"}],"version-history":[{"count":1,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts\/39683\/revisions"}],"predecessor-version":[{"id":121722,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/posts\/39683\/revisions\/121722"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/media\/39684"}],"wp:attachment":[{"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/media?parent=39683"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/tags?post=39683"},{"taxonomy":"blog_category","embeddable":true,"href":"https:\/\/www.litmus.com\/wp-json\/wp\/v2\/blog_category?post=39683"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}