Delay doesn't work with Custom CSS effects

[cmdalbem]

When using a custom CSS effect with delay the element is rendered, normally, and after the delay the effect takes places.

React:

<Reveal effect="blurIn" delay={500}>
    <img .../>
</Reveal>

CSS:

@keyframes blurIn {
  from { 
    filter: blur(30px);
    opacity: 0.7;
  }
  
  to {
    filter: blur(0);
    opacity: 1;
  }
}
.blurIn {
  animation-name: blurIn;
}

Result

[sravanreddy29]

It's not working for me either. but it works with css animation delay