WEBLEB
Home
AI Editor
Login
Pro
English
English
Français
Español
Text Shadow Animation
1,574
creativewiz
Open In Editor
Publish Your Code
0
Recommended
7 November 2024
Text Hover Animation Effect
8 July 2025
Character choose with preview card animation (CSS sprites)
29 September 2023
Order Button Animation
HTML
Copy
<!-- Replace with your HTML Code (Leave empty if not needed) --> <!DOCTYPE html> <html> <head> <title>Text Shadow</title> </head> <body> <span class="s1 s">C</span> <span class="s2 s">C</span> </body> </html>
CSS
Copy
<!-- Replace with your HTML Code (Leave empty if not needed) --> body { background-color: #000000; text-align: center; } .s { position: absolute; top: 50%; left: 50%; transform-origin: 50% 50%; transform: translate(-50%, -50%); font-size: 375px; font-family: Arial; color: #aa55ff; } .s1 { z-index: 1; text-shadow: 4px 4px 10px #000000, 5px 5px 75px #7722cc, -5px -5px 75px #7722cc; animation: text-shadow 3s alternate infinite; } .s2 { font-size: 380px; color: #000000; z-index: 2; } @keyframes text-shadow { from { text-shadow: 0px 0px 0px #000000, 0px 0px 0px #000000, 0px 0px 0px #000000; } to { text-shadow: 4px 4px 10px #000000, 5px 5px 75px #7722cc, -5px -5px 75px #7722cc; } }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */
