อินทนนท์-ภู-63070191
✨ นายอินทนนท์ แต่งตั้ง
<html> <head> <title>Let's Start </title> <style> body{ background:#333; margin:1em; font-family:sans-serif; } svg{ background:black; } </style> </head> <body> <svg viewBox="0 0 100 100"> <!-- Code Here --> <!-- lake --> <path d="M 1 85 V99 H99 v-15" stroke="#171b3b" fill="#151833" stroke-width="4"/> <!--- wave --> <path stroke="#304d96" fill="transparent" stroke-width="0.1" d=" m-6,88 q6,1 1,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 " ><animate attributeName="d" values=" m-6,88 q6,1 1,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0; m-5,88 q6,2 3,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0; m-6,88 q6,1 1,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 " dur="1s" repeatCount="indefinite" /> </path> <path stroke=" #3756a6 " fill="transparent" stroke-width=".1" d=" m1,92 q6,1 1,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 " ><animate attributeName="d" values=" m1,92 q6,1 1,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0; m1,92 q1,2 3,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0; m1,92 q6,1 1,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 " dur="1s" repeatCount="indefinite" /> </path> <path stroke=" #3756a6 " fill="transparent" stroke-width=".1" d=" m6,96 q6,1 1,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 " ><animate attributeName="d" values=" m6,96 q6,1 1,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0; m6,96 q6,3 2,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0; m6,96 q6,1 1,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 " dur="1s" repeatCount="indefinite" /></path> <!-- ground --> <path d="M 0 50 v100 h5 v-100" stroke="#2b2020" fill="#2b2020" stroke-width="1"/> <path d="M 1 85 V99 H74" stroke="#171717" fill="#171717" stroke-width="2"/> <path d="M 10 90 V99 H74" stroke="#242424" fill="#242424" stroke-width="1"/> <!-- Moon --> <path d="M 90 0 v100 h-150 h30 " stroke="#FFF176" fill="#FFF176" stroke-width="1" opacity='.05'><animate attributeName="opacity" values="0.05;0.1;0.05" dur="5s" repeatCount="indefinite"/></path> <circle cx="75" cy="20" r="30" stroke="#FBC02D" fill="#FDD835" stroke-width="5"> <animate attributeName="opacity" values="0.7;1;0.7" dur="5s" repeatCount="indefinite"/></circle> <circle cx="75" cy="20" r="40" stroke="#FBC02D" fill="#FDD835" stroke-width="5" opacity=".05"> <animate attributeName="opacity" values="0.05;0.1;0.05" dur="5s" repeatCount="indefinite"/></circle> <circle cx="25" cy="80" r="25" stroke="#8f8f8f" fill="#7d7d7d" stroke-width="" opacity=".05"> <animate attributeName="opacity" values="0.0;0.05;0.0" dur="5s" repeatCount="indefinite"/></circle> <!-- bush --> <circle cx="95" cy="92" r="10" fill="#12240a" opacity="1"/> <circle cx="84" cy="100" r="10" fill="#12240a" opacity="1"/> <circle cx="82" cy="93" r="2" fill="#330e0e" opacity="1"/> <circle cx="92" cy="85" r="2" fill="#330e0e" opacity="1"/> <circle cx="98" cy="93" r="2" fill="#330e0e" opacity="1"/> <circle cx="90" cy="97" r="2" fill="#330e0e" opacity="1"/> <circle cx="9" cy="50" r="10" fill="#12240a" opacity="1"/> <circle cx="0" cy="35" r="15" fill="#12240a" opacity="1"/> <circle cx="8" cy="22" r="10" fill="#12240a" opacity="1"/> <circle cx="10" cy="35" r="13" fill="#12240a" opacity="1"/> <circle cx="-6" cy="27" r="15" fill="#12240a" opacity="1"/> <!-- Rabbit --> <!-- back --> <path d="M 15.5 90 C 10 79, 27 75, 24 74" stroke="#424242" fill="#424242" stroke-linecap="round"/> <!-- tail --> <path d ="M 15.5 90 C 11 91,15 97, 17 91" stroke="#424242" fill="#424242" stroke-linecap="round"><animate attributeName="d" values=" M15.5,90 C9.5,91 15,97 17,91; M15.5,90 C11,91 15,97 17,92; M15.5,90 C9.5,91 15,97 17,91 " dur="1s" repeatCount="indefinite" /> </path> <!--<animate attributeName="d" values=" M30,65 c-20,25 60,25 40,0; M30,65 c0,30 40,30 40,0; M30,65 c-20,25 60,25 40,0 " dur="1s" repeatCount="indefinite" /> </path>----> <!-- leg --> <path d ="M 17 91 C 20 94,20 93, 20 93" stroke="#424242" fill="#424242" stroke-linecap="round"/> <path d ="M 20 93.5 C 19 100,31 93, 24 92" stroke="#424242" fill="#424242" stroke-linecap="round"/> <!--belly--> <path d ="M 24 92 C 28 88,27 85,27 82" stroke="#424242" fill="#424242" stroke-linecap="round"/> <!-- arm --> <path d ="M 27 82 C 26 82,35 88, 29 78" stroke="#424242" fill="#424242" stroke-linecap="round"><animate attributeName="d" values=" M 27 82 C 26 82,35 88, 29 78; M 27 82 C 26 82,35 90, 29 78; M 27 82 C 26 82,35 88, 29 78 " dur="1s" repeatCount="indefinite" /></path> <!-- neck --> <path d ="M 29 78 C 30 77,30 77, 30 77" stroke="#424242" fill="#424242" stroke-linecap="round"/> <!-- head --> <path d ="M 30 77 C 34 79,40 71, 35 70" stroke="#424242" fill="#424242" stroke-linecap="round"/> <path d ="M 35 70 C 28 63,28 72, 29 67" stroke="#424242" fill="#424242" stroke-linecap="round"/> <!-- ear --> <path d ="M 28.5 68 C 28 67,20 57, 13 68" stroke="#424242" fill="#424242" stroke-linecap="round"><animate attributeName="d" values=" M 28.5 68 C 28 67,20 57, 13 68; M 28.5 68 C 28 67,20 57, 13 67; M 28.5 68 C 28 67,20 57, 13 68 " dur="1s" repeatCount="indefinite" /></path> <path d ="M 27 71 C 22 64,16 68, 11 75" stroke="#424242" fill="#424242" stroke-linecap="round"><animate attributeName="d" values=" M 27 71 C 22 64,16 68, 11 75; M 27 71 C 22 64,16 68, 11 74; M 27 71 C 22 64,16 68, 11 75 " dur="1s" repeatCount="indefinite" /></path> <path d ="M 11 75 C 15 75,20 72, 26 72" stroke="#424242" fill="#424242" stroke-linecap="round"><animate attributeName="d" values=" M 27 71 C 22 64,16 68, 11 75; M 27 71 C 22 64,16 68, 11 74; M 27 71 C 22 64,16 68, 11 75 " dur="1s" repeatCount="indefinite" /></path> <path d ="M 26 72 C 27 76,20 73, 25 74" stroke="#424242" fill="#424242" stroke-linecap="round"/> <!--color--> <rect x="20" y="82" width="4" height="4" stroke="#424242" fill="#424242" stroke-width="5"/> <rect x="18" y="85" width="4" height="4" stroke="#424242" fill="#424242" stroke-width="5"/> <rect x="19" y="85" width="4" height="3" stroke="#424242" fill="#424242" stroke-width="5"/> <rect x="22" y="90" width="1" height="1" stroke="#424242" fill="#424242" stroke-width="5"/> <rect x="18" y="86" width="4" height="4" stroke="#424242" fill="#424242" stroke-width="5"/> <rect x="23" y="79" width="2" height="2" stroke="#424242" fill="#424242" stroke-width="5"/> <rect x="26" y="79" width="1" height="1" stroke="#424242" fill="#424242" stroke-width="5"/> <rect x="28" y="70" width="5" height="5" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="23" y="77" width="3" height="3" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="28" y="76" width="2" height=".1" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="32" y="70.5" width="2" height=".5" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="29.5" y="69" width="2.5" height=".1" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="29.5" y="68" width="1" height=".1" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="25" y="69" width="2.5" height=".1" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="24" y="75" width="2" height="1" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="26" y="70" width="1" height="3" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="24" y="75" width="2" height="1" stroke="#424242" fill="#424242" stroke-width="2"/> <rect x="24" y="75" width="2" height="1" stroke="#424242" fill="#424242" stroke-width="2"/> <!-- Grid --> <defs> <pattern id="grid" viewBox="0,0,10,10" width="1%" height="1%"> <rect fill="#0001" width="1" height="10" x="1" y="0"/> <rect fill="#0001" width="1" height="10" x="3" y="0"/> <rect fill="#0001" width="1" height="10" x="5" y="0"/> <rect fill="#0001" width="1" height="10" x="7" y="0"/> <rect fill="#0001" width="1" height="10" x="9" y="0"/> <rect fill="#0001" width="10" height="1" x="0" y="1"/> <rect fill="#0001" width="10" height="1" x="0" y="3"/> <rect fill="#0001" width="10" height="1" x="0" y="5"/> <rect fill="#0001" width="10" height="1" x="0" y="7"/> <rect fill="#0001" width="10" height="1" x="0" y="9"/> <path d="M0 0 h10 L9 1 h-8 v8 L0 10 z" fill="#ff05"/> <path d="M10 10 h-10 L1 9 h8 v-8 L10 0 z" fill="#0f05"/> <rect fill="#0002" width="10" height=".1" x="0" y="9.9"/> <rect fill="#0002" width="10" height=".1" x="0" y="0"/> <rect fill="#0002" height="10" width=".1" y="0" x="9.9"/> <rect fill="#0002" height="10" width=".1" y="0" x="0"/> </pattern> </defs> <rect fill="url(grid)" width="1000" height="1000" x="0" y="0" style="opacity:.5"/> </svg> <br> <br> <svg viewBox="0 0 100 100"> <path stroke="deeppink" stroke-width="2" d=" m10,70 q5,-20 10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 t10,0 " ></path> <circle r="1" fill="red" cx="20" cy="70"/> <circle r="1" fill="orange" cx="20" cy="30"/> <circle r="1" fill="green" cx="50" cy="30"/> <circle r="1" fill="deepskyblue" cx="80" cy="30"/> <circle r="1" fill="purple" cx="80" cy="70"/> <path fill="pink" stroke="deeppink" stroke-width="1" stroke-linecap="round" d="m30,10 c-10,20 10,20 0,0 " > </path> <path fill="pink" stroke="deeppink" stroke-width="1" stroke-linecap="round" d="m60,40 c-10,20 20,10 0,0 " > </path> <path fill="pink" stroke="deeppink" stroke-width="1" stroke-linecap="round" d="m40,80 c-20,0 0,10 0,0 " > </path> <path fill="pink" stroke="deeppink" stroke-width="1" stroke-linecap="round"> <animate attributeName="d" values=" m30,10 c-10,20 10,20 0,0; m60,40 c-10,20 20,10 0,0; m40,80 c-20,0 0,10 0,0 " dur="4s" repeatCount="indefinite" /> </path> <!-- Grid --> <defs> <pattern id="grid" viewBox="0,0,10,10" width="1%" height="1%"> <rect fill="#0001" width="1" height="10" x="1" y="0"/> <rect fill="#0001" width="1" height="10" x="3" y="0"/> <rect fill="#0001" width="1" height="10" x="5" y="0"/> <rect fill="#0001" width="1" height="10" x="7" y="0"/> <rect fill="#0001" width="1" height="10" x="9" y="0"/> <rect fill="#0001" width="10" height="1" x="0" y="1"/> <rect fill="#0001" width="10" height="1" x="0" y="3"/> <rect fill="#0001" width="10" height="1" x="0" y="5"/> <rect fill="#0001" width="10" height="1" x="0" y="7"/> <rect fill="#0001" width="10" height="1" x="0" y="9"/> <path d="M0 0 h10 L9 1 h-8 v8 L0 10 z" fill="#ff05"/> <path d="M10 10 h-10 L1 9 h8 v-8 L10 0 z" fill="#0f05"/> <rect fill="#0002" width="10" height=".1" x="0" y="9.9"/> <rect fill="#0002" width="10" height=".1" x="0" y="0"/> <rect fill="#0002" height="10" width=".1" y="0" x="9.9"/> <rect fill="#0002" height="10" width=".1" y="0" x="0"/> </pattern> </defs> <rect fill="url(#grid)" width="1000" height="1000" x="0" y="0" style="opacity:.5"/> </svg> <br> <br> <svg viewBox="0 0 100 100"> <path stroke-width="2" stroke="gold" stroke-linecap="round" d=" M20,70 C20,30 70,30 80,70 s0,0 20,0 " > </path> <path stroke-width="2" stroke="blue" stroke-linecap="round" d=" M30,65 c-20,30 60,30 40,0 " > <animate attributeName="d" values=" M30,65 c-20,25 60,25 40,0; M30,65 c0,30 40,30 40,0; M30,65 c-20,25 60,25 40,0 " dur="1s" repeatCount="indefinite" /> </path> <circle r="1" fill="red" cx="20" cy="70"/> <circle r="1" fill="purple" cx="80" cy="70"/> <circle r="1" fill="green" cx="50" cy="30"/> <circle r="1" fill="orange" cx="20" cy="30"/> <circle r="1" fill="deepskyblue" cx="80" cy="30"/> <!-- Grid --> <defs> <pattern id="grid" viewBox="0,0,10,10" width="1%" height="1%"> <rect fill="#0001" width="1" height="10" x="1" y="0"/> <rect fill="#0001" width="1" height="10" x="3" y="0"/> <rect fill="#0001" width="1" height="10" x="5" y="0"/> <rect fill="#0001" width="1" height="10" x="7" y="0"/> <rect fill="#0001" width="1" height="10" x="9" y="0"/> <rect fill="#0001" width="10" height="1" x="0" y="1"/> <rect fill="#0001" width="10" height="1" x="0" y="3"/> <rect fill="#0001" width="10" height="1" x="0" y="5"/> <rect fill="#0001" width="10" height="1" x="0" y="7"/> <rect fill="#0001" width="10" height="1" x="0" y="9"/> <path d="M0 0 h10 L9 1 h-8 v8 L0 10 z" fill="#ff05"/> <path d="M10 10 h-10 L1 9 h8 v-8 L10 0 z" fill="#0f05"/> <rect fill="#0002" width="10" height=".1" x="0" y="9.9"/> <rect fill="#0002" width="10" height=".1" x="0" y="0"/> <rect fill="#0002" height="10" width=".1" y="0" x="9.9"/> <rect fill="#0002" height="10" width=".1" y="0" x="0"/> </pattern> </defs> <rect fill="url(#grid)" width="1000" height="1000" x="0" y="0" style="opacity:.5"/> </svg> </body> </html>