Cool way to hide an email address on a website

December 14, 2021    Article    85 words    1 min read

Here is a simple and cool way to hide your contact email address on a website. Basically I’m using the unicode-bidi and direction CSS properties to change the direction of text from ltr (left to right) to rtl (right to left). Browsers that don’t support the unicode-bidi property will see the email inverted so that might be a problem.

<style>
span.email-obfuscated {
	unicode-bidi: bidi-override;
	direction: rtl;
}
</style>
<p>You can contact me at <span class="email-obfuscated">won.erehw@ohw</span>.</p>

The output will be:

You can contact me at .