CSS Text Shadows (Webkit Only!)

by sandesh2302

HTML

<link href='http://fonts.googleapis.com/css?family=Terminal+Dosis:400,800' rel='stylesheet'>


<h2 class="rounded" data-title="Netflix">Netflix</h2>

CSS

body {
    background: #c4453c;
}
h2 {
    margin: 0 10px ;
}

.rounded {
    color: #f6f6f6;
    font: 110px/1 'Terminal Dosis', sans-serif;
    letter-spacing: 13px;
    position: relative;
    text-transform: uppercase;                
    text-shadow: 0 0 3px rgba(255,255,255,.29);
}
.rounded:after {
    color: #333;
    content: attr(data-title);
    font-size: 110px/1;
    //font-weight: 800;
    left: 0px;
    letter-spacing: 13px;
    position: absolute;
    text-shadow: 0 0 3px rgba(0,0,0,.29);
    top: 4px;
    left: 4px;
    z-index: -1;
}