Gooey Kirby
✨ นางสาวชุติมา ณะแก้ว
<html> <head> <title>Let's Start </title> <style> body{ background:#fff; margin:1em; } svg{ background:#fff; } </style> </head> <body> <svg viewBox="0 0 50 50"> <defs> <radialGradient id="grad1" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:#3934d7;stop-opacity:0.8" /> <stop offset="100%" style="stop-color:#3934d7;stop-opacity:1" /> </radialGradient> </defs> <ellipse cx="25" cy="20" rx="24" ry="18" fill="url(#grad1)"/> <circle cx="20" cy="20" fill="#fff" r="4"></circle> <circle cx="30" cy="20" fill="#fff" r="4"></circle> <circle cx="19" cy="21.5" fill="#000" r="1.5" > <animateTransform attributeName="transform" begin="0s" dur="2.5s" type="rotate" from="-6" to="0" repeatCount="indefinite" /></circle> <circle cx="30.5" cy="21.5" fill="#000" r="1.5"> <animateTransform attributeName="transform" begin="0s" dur="2.5s" type="rotate" from="-4.5" to="0" repeatCount="indefinite"/></circle> <defs> <linearGradient id="grad2" x1="0%" y1="0%" x2="0%" y2="100%"> <stop offset="0%" style="stop-color:#852031;stop-opacity:1" /> <stop offset="100%" style="stop-color:#c73c5f;stop-opacity:1" /> </linearGradient> </defs> <ellipse cx="25" cy="30" rx="14" ry="2" fill="url(#grad2)"> <animate attributeName="ry" values="1;1;2;1;1" dur="2.5s" repeatCount="indefinite" /></ellipse> <defs> <linearGradient id="grad3" x1="0%" y1="0%" x2="0%" y2="100%"> <stop offset="0%" style="stop-color:#d63c60;stop-opacity:1" /> <stop offset="100%" style="stop-color:#fc5277;stop-opacity:1" /> </linearGradient> </defs> <ellipse cx="25" cy="39.5" rx="3" ry="10.3" fill="url(#grad3)"> <animateTransform attributeName="transform" begin="0s" dur="2s" type="rotate" values="0;1;0;1;" repeatCount="indefinite"/></ellipse> </svg> </body> </html>