Multiplicity

–aggregating the internet, so you don't have to
A blog by Alex DiFiori

home  archive  mobile  rss
simurai: I ♥ BLUR - Once again, I got distracted experimenting with CSS3. ;-) So far I just knew how to make text look blurry by adding a lot of text-shadows like in this example by David. But it’s more a glow, because the text still stays in front. But what if you wanna turn text into smoke? Luckily you can set the text-fill-color to transparent and that gives your text a really nice smoky blur. color: transparent;text-shadow: #fff 0 0 100px; That’s it! And if you animate it, it get’s even sexier. See the Demo → Update: Ohh.. snap. Some friendly people on twitter pointed out that there is actually an even simpler way to create Text Blur. So before this get’s too embarrassing, I quickly should change the code above. ;-) By using just color instead of -webkit-text-fill-color it also works in Firefox (although the blur looks a bit stronger). Thanks for telling. Flash, we’re gunning for your head.

simurai:

I ♥ BLUR - Once again, I got distracted experimenting with CSS3. ;-) So far I just knew how to make text look blurry by adding a lot of text-shadows like in this example by David. But it’s more a glow, because the text still stays in front. But what if you wanna turn text into smoke? Luckily you can set the text-fill-color to transparent and that gives your text a really nice smoky blur.

color: transparent;
text-shadow: #fff 0 0 100px;

That’s it! And if you animate it, it get’s even sexier.

See the Demo →

Update: Ohh.. snap. Some friendly people on twitter pointed out that there is actually an even simpler way to create Text Blur. So before this get’s too embarrassing, I quickly should change the code above. ;-) By using just color instead of -webkit-text-fill-color it also works in Firefox (although the blur looks a bit stronger). Thanks for telling.

Flash, we’re gunning for your head.

Posted || home

Notes:

  1. jeen-hao reblogged this from free-rider
  2. idmserial reblogged this from free-rider
  3. free-rider reblogged this from simurai and added:
    Randy Dave Collection
  4. matthew-harrison reblogged this from simurai
  5. cheap-papers reblogged this from simurai
  6. bluray3d reblogged this from simurai
  7. how-to-text--a-girl reblogged this from simurai
  8. furiael reblogged this from simurai
  9. jalbertbowdenii reblogged this from simurai
  10. messablehair reblogged this from simurai
  11. guznico reblogged this from simurai
  12. shine-like-millions reblogged this from simurai
  13. noehoyeayhh reblogged this from simurai
  14. fieryecyoj reblogged this from simurai
  15. dreamwithnicole reblogged this from lyien

← previous post
next post →

Multiplicity using If This, Then Theme.