How to pass props to keyframes in styled-component with react?

You can make moveVertically a function. Please consider code below:

const moveVertically = (y) => keyframes`
    0% {
        transform : translateY(0px) 
    }
    100% {
        transform : translateY(${y}px)
    }
`;

const BallAnimation = styled.g`
    animation : ${props => moveVertically(props.y)} ${props => props.time}s linear
`;

Here you have y in props of BallAnimation. So you can extract it and pass it to moveVertically function which accepts y value as a parameter.