Anvar Logo
01 / 01

How to add 3d effect with css

With the help of CSS3 you can add shadow to text and to elements. You can simply add the 3d effects it’s a good way
CSS Code

<style> h1 { text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 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); } </style>

And you can insert this in the html tag or class
Html Code

<h1 class="h1-3d">Hello World !</h1>
by anvar
Published : May , 9

Post a comment

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

WhatsApp Logo Chat