SVG 1 การบ้าน แทน ภูมินทร์
✨ POOMIN KAJORNSAKDA
<html> <head> <title>SVG </title> <style> body{ background:#87CEEB; margin:0em; margin-top:2em; font-family:sans-serif; } svg{ background: linear-gradient(#99C8FF, #0B7EFF); width:90vmin; height:90vmin; display:block; margin:auto; box-shadow:0px 0px 10px #0006; } </style> </head> <body> <svg viewBox="0 0 100 100"> <defs> <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%"> <stop offset="0%" style="stop-color:rgb(102,51,0);stop-opacity:1" /> <stop offset="100%" style="stop-color:rgb(204,102,0);stop-opacity:1" /> </linearGradient> </defs> <defs> <radialGradient id="grad2" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:#ff9933; stop-opacity:0" /> <stop offset="100%" style="stop-color:rgb(0,0,255);stop-opacity:1" /> </radialGradient> </defs> <circle cx="13" cy="60" r="0.6" fill="white" /> <circle cx="10" cy="55" r="0.4" fill="white" /> <circle cx="9" cy="68" r="1" fill="white" /> <circle cx="16" cy="46" r="0.3" fill="white" /> <circle cx="25" cy="40" r="0.2" fill="white" /> <circle cx="16" cy="38" r="0.2" fill="white" /> <circle cx="55" cy="48" r="0.3" fill="white" /> <circle cx="53" cy="53" r="0.4" fill="white" /> <circle cx="56" cy="55" r="0.5" fill="white" /> <circle cx="52" cy="57" r="0.6" fill="white" /> <circle cx="55" cy="48" r="0.3" fill="white" /> <circle cx="53" cy="53" r="0.4" fill="white" /> <circle cx="56" cy="55" r="0.5" fill="white" /> <circle cx="52" cy="57" r="0.6" fill="white" /> <circle cx="85" cy="38" r="0.3" fill="white" /> <circle cx="83" cy="43" r="0.4" fill="white" /> <circle cx="86" cy="35" r="0.5" fill="white" /> <circle cx="82" cy="37" r="0.6" fill="white" /> <circle cx="85" cy="28" r="0.3" fill="white" /> <circle cx="86" cy="21" r="0.5" fill="white" /> <circle cx="82" cy="27" r="0.6" fill="white" /> <ellipse cx="50" cy="95" rx="50" ry="25" fill="url(#grad1)" /> <ellipse cx="10" cy="100" rx="50" ry="25" fill="url(#grad1)" /> <ellipse cx="70" cy="100" rx="50" ry="25" fill="url(#grad1)" /> <circle cx="5" cy="80" r="3" fill="#006400" /> <circle cx="7" cy="75" r="3" fill="#006400" /> <circle cx="8" cy="71" r="3" fill="#006400" /> <ellipse cx="4" cy="84" rx="4" ry="3" fill="#808080" /> <circle cx="50" cy="80" r="3" fill="#006400" /> <circle cx="50" cy="75" r="3" fill="#006400" /> <circle cx="48" cy="71" r="3" fill="#006400" /> <ellipse cx="49" cy="84" rx="4" ry="3" fill="#808080" /> <circle cx="80" cy="80" r="3" fill="#006400" /> <circle cx="81" cy="75" r="3" fill="#006400" /> <circle cx="84" cy="71" r="3" fill="#006400" /> <ellipse cx="80" cy="84" rx="4" ry="3" fill="#808080" /> <rect width="100" height="25" style="fill:#71BCE1" /> <circle cx="10" cy="10" r="5" stroke="#ffc04c" stroke-width="0.5" fill="#ffa500" /> </svg> </body> </html>