CSS ‐ Examples

Add a filter to the dots

Create a class 'dot_outline' and apply it to the animation as class

.dot_outline {
    /* Filter with the blue shadow */
    filter: drop-shadow(0px 0px 4px blue);
}

which results in:

If you want the shadow to blink, just use the animation example below.

Blinking Icon/Text

Create a class 'blink_icon' and an animation class 'pulse-ani-blink' and apply it to the text or icon

.blink_icon {
    /* Color of the Icon - use stroke, if you want to change the color of text */
    color: rgb(161,211,67)!important;

    /* Name of the animation for the filter/shadow */
    animation: pulse-ani-blink 3s linear infinite;
}

/* Animation timing for the shadow of the Icon/Text */
@keyframes pulse-ani-blink {
  50% {
    filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, .175)) drop-shadow(0px 0px 4px rgba(0, 0, 0, .175)) drop-shadow(0px 0px 4px rgba(0, 0, 0, .175));
  }

  0%,
  100% {
    filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, .175));
  }
}

which results in: