3D Text Effect Using CSS3

CSS3 can be used to create 3D effects for heading and decorations. Here is the basic setup.  To give the 3D effect we will use simple text-shadow property. CSS3 'text-shadow' property supported by all modern browsers as well.

text-shadow: h-shadow v-shadow blur-radius color;  or  <X> <Y> <Blur size> <Color>

h = horizontal shadow
v = vertical shadow
blur radius
color

ie; text-shadow:1px 2px 4px red

 CSS

body {
    background: #000;
    width: 600px;
    margin: auto;
}
.three-d {
    color: #fff;
    letter-spacing: 2px;
    font-family: Oswald;
    font-size: 8em;
    text-shadow: 1px 1px #16acff, 6px 6px #16acff;
    3px 3px #16acff, 4px 4px #16acff, 2px 2px #16acff, 5px 5px #16acff,
}

HTML

<p class='three-d'>CodeRomeos</p>