10+ Stunning CSS Glowing Text Effect – Stackfindover

Hello Friends, in this article I will teach you how to create css glowing text effect, and also I have listed 10+ glowing text examples made with HTML, CSS & JavaScript. Check out these excellent examples which are available on CodePen.

How To Create a Glowing Text

First we have to use the text-shadow property to create the glowing text effect, and also we can use keyframes animation to add the repeatedly glowing effect.

HTML:

<h2 class="glowing-text">Stackfindover</h2>

CSS:

.glowing-text {
  font-size: 80px;
  color: #fff;
  text-align: center;
  -webkit-animation: glowing-text 1s ease-in-out infinite alternate;
  -moz-animation: glowing-text 1s ease-in-out infinite alternate;
  animation: glowing-text 1s ease-in-out infinite alternate;
}

@-webkit-keyframes glowing-text {
  0% {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #2e00e6, 0 0 40px #6300e6, 0 0 50px #c300e6, 0 0 60px #e200e6, 0 0 70px #e600ca;
}
  
  100% {
    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
  }
}

Result:

We can also use text-shadow without keyframes animation to create glowing text.

.glowing-text {
  font-size: 80px;
  color: #fff;
  text-align: center;
  text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
}

Best Collection of CSS Glowing text

In this collection, I have listed over 10+ best Glowing text made with HTML, CSS, and JS. Check out these awesome Glowing text animation examples like: #1 Shimmering glowing text, #2 Awesome Glowing Text, #3 CSS Glowing on click, and many more.

#1 Shimmering glowing text

Shimmering glowing text using HTML and CSS, which was developed by Comehope. Moreover, you can customize it according to your wish and need.

#2 Animated glowing text effect

Animated glowing text effect using HTML and CSS(SCSS), which was developed by Bennett Feely. Moreover, you can customize it according to your wish and need.

#3 Simple Glowing text button style

Simple Glowing text button style using HTML and CSS, which was developed by Pratham. Moreover, you can customize it according to your wish and need.

#4 CSS Glowing fire animated text

Glowing fire animated text using HTML and CSS, which was developed by zFunx. Moreover, you can customize it according to your wish and need.

#5 Glowing text animation

Animated neon glow text using HTML and CSS, which was developed by Habib. Moreover, you can customize it according to your wish and need.

#6 flickering glowing text animation

Flickering glowing text animation using HTML and CSS, which was developed by t1llo. Moreover, you can customize it according to your wish and need.

#7 Glowing Text Loading Animation

Glowing Text Loading Animation using HTML and CSS, which was developed by Shashwata. Moreover, you can customize it according to your wish and need.

#8 Neon Glowing Text Animation

Neon Glowing Text Animation using HTML and CSS, which was developed by Sujoy Sarkar. Moreover, you can customize it according to your wish and need.

#9 Glowing text typography effect

Unique neon text effect using HTML and CSS, which was developed by Anmol P. Moreover, you can customize it according to your wish and need.

#10 Simple Neon text animation

Simple Neon text animation using HTML and CSS, which was developed by Mark Heggan. Moreover, you can customize it according to your wish and need.

#11 Multiple Glowing text animation examples

Multiple CSS Glowing animation examples using HTML, CSS and JavaScript which was developed by Erik Jung. Moreover, you can customize it according to your wish and need.

#12 Black mirror cracked glowing text effect

Black mirror cracked effect using HTML and CSS which was developed by George W. Park. Moreover, you can customize it according to your wish and need.

#13 3d CSS glowing text effect

3d lighting text effect using HTML and CSS which was developed by Shaiq Kar. Moreover, you can customize it according to your wish and need.

We hope you liked this article. You should definitely keep your thoughts about it in the comment below and share this article with your friends.