Glowing Animation Effects

Hi,

How can it be done without coding?

Is there a plugin that you can build for it?

I came across this social media icon glowing effect codes for CSS and HTML

How can I add the code to a section?

I have tried to put the CSS code inside a section but it didn’t work.

1 Like

Hi Pakic

How is it possible to make the glowing colors work in a loop like that?

http://dashboard.konvey.app/share/7790014a-53f0-419e-902b-d86180a473cb

I am able to do this effect manually by going to the BG color and scrolling on all the color ranges.

Is it possible to make an automation on it with a specific ms for the speed of it?

Is it possible that each icon will have a slightly different ms time to make this glowing row effect?

For this, do I need to remove the loop and configure each icon to work separately?

Right now, because of the loops, the effect is happening on all of the icons.

I need different colors for each icon.

How can I do that?

http://dashboard.konvey.app/share/40561274-7ec2-4c8c-854a-c3a6dd425e43

Hi Pakic

Another question that comes from your tutorial is:

On the Glow effect Div, there is position Absolute:
You wanted to put the red square under the photo.

Why did you use a simple transform 50px vertical instead of using the position feature?
Do these 2 features have different effects or they are the same?

I never think of the simple transform when I want to move objects. Only the position feature.

If you want different color, you can’t use loop in a simple way, you would need to use a bit of custom CSS then, which is not that simple, easiest is to create one icon to be fully working with hover effect and everything and then just duplicate and change color.

When you are working with position absolute and set top 50%, and then go to transform and set Move to be vertical -50%, then your absolute tag will be vertically centered perfectly.

Here’s an video explanation for that:

1 Like

Thanks a lot for this video!!

Now I understand but why you didn’t make the absolute middle already with transform -50%?

Why the middle button for absolute doesn’t do that already?

And regarding the code, I have all the code ready.
I have asked in this topic on how can I add the code to my website.
There is HTML code and CSS code.

https://codepen.io/Krishnaa_Gupta/pen/MWoRqmr

Hi @Pakic

How Can I make it glow only on hover exactly?