The above is a first attempt at animating an image of handwriting. It is based on an article here: Animated Handwriting Effect with CSS

Whilst removing unnecessary items I discovered that the stroke attribute in a path element seems to be needed. There is a default of black but to specify any other colour there is no alternative but to have the stroke attribute in each path. I tried putting it in a class but this didn't seem to work. I tried adding 'fill="currentColor' but that didn't work either. So in the end, each path specifies the same stroke colour.