Metal Text code:
1.index.html:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Metal Text</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <h1> <span>Metal Text</span> <span>Metal Text</span> </h1> </body> </html>
2.style.css:
body { margin: 0; padding: 0; background: black; background-size: cover; } h1>span { position: absolute; top: 50%; transform: translateY(-50%); margin: 0; padding: 0; width: 100%; text-align: center; font-family: Verdana, Geneva, Tahoma, sans-serif; font-style: italic; font-size: 5em; text-transform: uppercase; letter-spacing: 5px; background: linear-gradient(black, grey, black); -webkit-background-clip: text; color: transparent; } h1>span:nth-child(1) { z-index: 2; } h1>span:nth-child(2) { z-index: 1; text-shadow: 1px 1px 0 black, 2px 2px 0 black, 3px 3px 0 black, 4px 4px 0 black, 5px 5px 0 black, 1px 1px 0 black, 6px 20px 20px rgba(0,0,0,1); }
