How to create 3D image by using multiple text shadows?

    • This property give designers and css coders a tool to give multiple text effects. Earlier which could only be done by giving effects to an image. There are various advantages of this property.
      1. As Text in an image is not searchable by search engines.
      2. CSS file size is very small in comparison to an image.
      3. Easy to update.
    • Final result

www.phpmind.com

  • Very simple and easy to use code which gives 3D look to your text.
  •     text-shadow: 0 1px 0 #3cc4fc,
                   0 2px 0  #4fcbfe,
                   0 2px 0 #5dd0ff,
                   0 3px 0 #6bd3fe,
                   0 4px 0 #78d5fc,
                   0 4px 1px rgba(0,0,0,.1),
                   0 0 5px rgba(0,0,0,.1),
                   0 1px 3px rgba(0,0,0,.3),
                   0 3px 5px rgba(0,0,0,.2),
                   0 5px 10px rgba(0,0,0,.25),
                   0 10px 10px rgba(0,0,0,.2),
                   0 20px 20px rgba(0,0,0,.15);
    }
  • Browser support: The text-shadow rule is supported by many modern browsers including IE10.
Share

Leave a Reply

Your email address will not be published. Required fields are marked *