Change Ant Design Skeleton loader color gradient

Question

I need lighter shades of grey to use with the skeleton loaders.

I tried directly overriding the CSS, like so:

.ant-skeleton-content {
            .ant-skeleton-title {
                background: linear-gradient(
                    90deg,
                    green 25%,
                    red 37%,
                    blue 63%
                ) !important;
            }
        }

This does override the color gradient, but stops the animation from working for some reason.

Answer 1

Change the background-image attribute instead of background, like so:

.ant-skeleton-content {
  .ant-skeleton-title {
    background-image: linear-gradient(
      90deg,
      green 25%,
      red 37%,
      blue 63%
    ) !important;
  }
}

Its not optimal since there is some glitch at the end of the animation once it start over again and "jumps" to the initial color, try to improve it.

By the way, I found it to be a bit more elegant if the percentages are removed from the colors declarations.