Overwrite Gmail Blue Color Link; How to Fix Blue Links in Gmail?

By Nischal Tiwari,

  Filed under: Blog
  Comments: None

I am an EDM Developer as well and needs to work on the Email Building and testing. I was struggling to find the solution for the blue color links issue in Gmail. It almost took my couple of hours at work to find out the solution. Please try this and you will feel you are in heaven, esp. if you are finding hard to fix it.

The code uses couple of classes like you’ve to use body class=”body” and define m_footer for the table column.

First Attempt:

/*Define the hyperlink color*/
a {color:#FF6600;}

      /*Gmail specific free text line height fix*/
      u + .body .m_free-text span {
        line-height: 1.2em;
      /*Gmail specific free text and footer font color fix*/
      u + .body .m_free-text a, u + .body .m_footer a {
          color: #FF6600 !important;

Final Result:

Download full code

Be the first to write a comment.

Your feedback