Your Problem with the lily pad is aliasing.
To demonstrate I’ve made four renders of a simple red ball on a blue background. The resolution goes up from 16x16 to 128x128 pixels. I’ve blown up all the renders so they are the same size. Just think of it as the pixels being larger in the left hand images. Unlike the real world where there are millions of photons zipping off objects textures only have a few hundred points to express an object.
If you look at the left hand image it was rendered at 16x16 pixels. That’s only 256 total points to express the red ball on the blue background. Look at the balls edge and you will see different colors. They are not red ball or blue background, they are a purple alias of the two colors. This is the nearest color to red-blue that the computer can find to express that portion of the ball given the number of pixels it was allowed.
So what’s going on with the lily pad?
You probably used a binary transparency and selected the background color as your transparency color. I’ll bet it was white, but there are alias pixels along the edge. They aren’t white and they aren’t lily pad, so they show up as a halo around the image.
What to do?
Start with an image twice as big. If you want 512x512 begin with a 1024x1024 image.
Create a .png with transparency like you did before.
Reduce the image by 50%. The computer combines and averages 4 pixels into 1. The transparencies and green edges get pulled towards each other. The halo all but goes away.
