153 total views, 2 views today

Here’s a quick tip for things like hero images with text over them or any other situation where you want to make your text pop a little rather than blending into the background.
Using text-shadow on your text can give the effect of it being outlined. This does work best on Arial type fonts and larger fonts. But it’s a handy trick to make the text stand out a bit.
<style>
p {
font-family: Arial, Helvetica, sans-serif;
font-size: 5em;
color: #ff0000;
text-shadow: -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000;
}
</style>
<p>Outline Text</p>
No responses yet