Glowing Text Effect In Pure CSS

Category: CSS & CSS3 , Text | May 18, 2021
Author:Neel-Kr
Views Total:77 views
Official Page:Go to website
Last Update:May 18, 2021
License:MIT

Preview:

Glowing Text Effect In Pure CSS

Description:

A set of glowing text effects made using the CSS text-shadow property.

Examples:

h1 {
  color:#fff;
  text-shadow: 0 0 4px #fff,
  0 0 30px rgb(132, 0, 255),
  0 0 40px rgb(132, 0, 255),
  0 0 50px rgb(132, 0, 255);
}
.p1 {
  font-size: 20px;
  color: rgb(255, 255, 255);
  text-shadow: 0 0 4px rgb(255, 255, 255),
  0 0 30px rgb(132, 0, 255);
  letter-spacing: 2px;
  margin-left: 20px;
}
.p2 {
  font-size: 20px;
  color: rgb(255, 255, 255);
  text-shadow: 0 0 4px rgb(255, 255, 255),
  0 0 30px rgb(21, 255, 0);
  margin-left: 20px;
  letter-spacing: 2px;
}
.p3 {
  font-size: 20px;
  color: rgb(255, 255, 255);
  text-shadow: 0 0 4px rgb(255, 255, 255),
  0 0 30px rgb(0, 255, 221);
  margin-left: 20px;
  letter-spacing: 2px;
}
.p4 {
  font-size: 20px;
  color: rgb(255, 255, 255);
  text-shadow: 0 0 4px rgb(255, 255, 255),
  0 0 30px rgb(255, 0, 234);
  margin-left: 20px;
  letter-spacing: 2px;
}
.p5 {
  font-size: 20px;
  color: rgb(255, 255, 255);
  text-shadow: 0 0 4px rgb(255, 255, 255),
  0 0 30px rgb(255, 0, 234);
  margin-left: 20px;
  letter-spacing: 2px;
}

You Might Be Interested In:


Leave a Reply