In websites with a dark theme, using light effects for different titles and parts of the text can attract more attention from the audience of your website. One of these light effects is listed in this code. In this code, the text is white and has a red shade. The background is also black. It evokes a state of red light.


HTML
<!-- This script got from www.devanswer.com -->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/" />
<div class="container">
    <div id="text-box">devanswer.com</div>
</div>  <div id="bcl"><a style="font-size:8pt;text-decoration:none;" href="http://www.devanswer.com">Developers Answer</a></div>
                        

CSS
body {
	font-size: 15pt;
	font-family: 'Cedarville Cursive', cursive;
	background: #000000;
}
.container {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border-radius: 7px;
}
#text-box {
	font-size: 60px;
	padding: 30px 70px;
	border-radius: 20px;
	border: 3px solid #FF7D7D;
	background: transparent;
	box-shadow: 0px 0px 40px 10px #FF0000, inset 0px 0px 30px 0.1px #FF0000;
	color: #FF7D7D;
	text-align: center;
	align-content: center;
	text-shadow: 0px 0px 2px #FF0000, 0px 0px 4px #FF0000, 0px 0px 10px #FF0000, 0px 0px 10px #FF0000, 0px 0px 10px #FF0000, 0px 0px 30px #FF0000, 0px 0px 40px #FF0000, 0px 0px 40px #FF0000, 0px 0px 40px #FF0000, 0px 0px 45px #FF0000, 0px 0px 65px #FF0000;
	letter-spacing: 1px;
	filter: brightness(300%);
}
a {
	width: 60%;
	text-decoration: none;
	text-align: center;
	background: #ffffff;
	border: 3px solid #000000;
	font-weight: 450;
	border-radius: 10px;
	padding: 10px;
	position: absolute;
	top: 600px;
	left: 50%;
	transform: translate(-50%, -50%);
	letter-spacing: 1px;
	color: #000000;
	font-family: sans-serif !important;
}