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

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


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,


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