Text Shadow

Developer
Tulula Smith
Size
1,910 Kb
Views
6,072
  1. Text Shadow Previews
  2. Text Shadow HTML Codes
  3. Text Shadow CSS Codes

How do I make an text shadow?

Play with text shadow's & selection. Using keyframe animation as a header reveal.. What is a text shadow? How do you make a text shadow? This script and codes were developed by Tulula Smith on 10 November 2022, Thursday.

Text Shadow Previews
IQ Test

Text Shadow - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Text Shadow</title> <link href="https://fonts.googleapis.com/css?family=Lora:400,700" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div> <h1><span>@</span>Tulula</h1> <h2>CSS/HTML</h2>
</div>
</body>
</html>

Text Shadow - Script Codes CSS Codes

* { margin: 0; padding: 0;
}
::selection { background: rgba(213,213,213,1); color: rgba(218,228,228,1);
}
::-moz-selection { background: rgba(213,213,213,1); color: rgba(218,228,228,1);
}
body { background: rgba(218, 228, 228, 1); font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
div { margin: auto; position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 320px;
}
h1,
h2 { font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; text-align: center; font-size: 9em; color: rgba(218, 228, 228, 1); animation: shadow ease 1 3s 2s forwards;
}
h2 { font-size: 5.5em; font-weight: 100; animation-delay:3s;
}
span { font-family: 'Lora', serif; font-size: .8em; vertical-align: text-top;
}
@keyframes shadow {	10% {	text-shadow: rgba(228,228,228,.5) 0 1px 0;	}	100% {	color: rgba(233,233,233,1);	text-shadow:	rgba(228,228,228,.5) 0 1px 0,	rgba(218,218,218,.5) 0 2px 0,	rgba(208,208,208,.5) 0 3px 0,	rgba(198,198,198,.5) 0 4px 0,	rgba(188,188,188,.5) 0 5px 0,	rgba(178,178,178,.5) 0 6px 0,	rgba(168,168,168,.5) 0 7px 0,	rgba(158,158,158,.5) 0 8px 0,	rgba(148,148,148,.5) 0 9px 0,	rgba(130,130,130,1) 0 10px 15px;	}
}
Text Shadow - Script Codes
Text Shadow - Script Codes
Home Page Home
Developer Tulula Smith
Username Tulula
Uploaded November 10, 2022
Rating 3
Size 1,910 Kb
Views 6,072
Do you need developer help for Text Shadow?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Tulula Smith (Tulula) Script Codes
Name
Responsive Test
42 Semantic Way
Unique Number Gen
Curtains
Overlay Text BROKEN-trying to fix
Heart-it
Code syntax
Color Generator
JS Video Control Play
Drive Clock
Create amazing art & images with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!