The absolute easiest way to beat blue links in emails on iOS

Over the years I’ve used lots of different methods for banning blue links. As with every method I use in email development, they gradually get simpler and better as time goes by.

Never has that been truer than about fixing the issue when dates, addresses and phone numbers are automatically linked on iPads and iPhones but they are styled with a default blue underline that looks terrible in anything except a personal text-only email.

Fixing this used to involve wrapping things in spans or adding classes, but that is annoying and also not helpful when you’re coding a reusable template since the added text will routinely include numbers, addresses and dates.

These days, I fix this by targeting the x-apple-data-detectors property that is added to these automatic links and setting them to simply inherit the styles around them.

And that’s it. If there are any other properties you want them to inherit, just go ahead and add them.

Au revoir, blue links!

I came across this trick viewing a source on an email a while ago, so I’m not entirely sure who I can credit for it, but there is more on the method here and here.