
Its pretty easy to make some blurry text with CSS. We can do it by just making the text color transparent and adding some text shadow. Here's the code for the same:
Blurry Text with CSS
To do it on normal text we can create a class and use SPAN tag to make the text blurry.
Example: This text will be blurry!
HTML Code
<span >This text will be blurry!</span>
CSS Code
.blur{ color: transparent; text-shadow: 0 0 3px rgba( 0, 0, 0, 0.5); }
Blurry Text Links on Hover
We can make the links blurry on hover by adding the blurry styles on a:hover pseudo class.
<a href="" title="">This link text will be blurry on hover.</a>
a.blurry-links{ color:red; } a.blurry-links:hover{ color: transparent; text-shadow: 0 0 3px rgba( 0, 0, 0, 0.5); }
You can always change the RGB values and the opacity for the text-shadow property and have the blurry text in different color.
Comments on How to make Blurry Text with CSS