Bits and pieces of my life
Tutorial: Beautify your text with CSS!

Note the above text has;
  • text-shadow
  • clipped-background
  • beautiful font(cursive)
..and guess what..they're all made of CSS coding! ..not an image made in photoshop or something, that's the best part ya see.. Here's what you do:

  • download a nice font via Dafont or choose a font from google/webfonts
  • browse the internet for a nice background/image/gif
  • copy&paste the following codes (you can edit the codes to you hearts desire!)
paste the following codes after <style type="text/css">

.name {
  color: #ccc;
    background-image: url('');
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-weight: bold;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;

text-shadow: 0 0 0.7em       #eee;
   -webkit-text-stroke: 0.2px white;

*the text in pink are important codes.
..and voila! you're done!

Newer Posts Older Posts