DEV Community

Deepak Devanand
Deepak Devanand

Posted on

6

Pulse —CSS Animation

#css #webdev #design

A pulsating circular element in the UI is an indicator of something real-time. Adding such an element next to charts with constantly updating data is a fine visual cue.

  • Box Shadow: Cast shadow around the element 
  /* offset-x | offset-y | blur-radius | spread-radius | color 
  */
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
Enter fullscreen mode Exit fullscreen mode
  • Scale3d: Resize the element in 3D space 
  scale3d(sx, sy, sz)
Enter fullscreen mode Exit fullscreen mode

Top comments (0)

DEV Community

Timeless DEV post...

CSS can do that? 🤯

css can do that?

👋 Kindness is contagious

Engage with a wealth of insights in this thoughtful article, cherished by the supportive DEV Community. Coders of every background are encouraged to bring their perspectives and bolster our collective wisdom.

A sincere “thank you” often brightens someone’s day—share yours in the comments below!

On DEV, the act of sharing knowledge eases our journey and forges stronger community ties. Found value in this? A quick thank-you to the author can make a world of difference.

Okay