SVGExam
✨ SarunC4
<html> <head><title>คิม ศรัณย์ เชิดวงศ์ตระกูล (63070164)</title></head> <style> body{ margin:0; } @keyframes time{ from{background: #204A74;} to{background: #64A8ED;} } svg{ background: #204A74; width:100%; animation: time 10s infinite alternate; } </style> <body> <svg viewBox="0 0 100 100"> <path d="M28,42 l7,-16 l3,7" fill="#aeacb9" stroke-width="0"> <animate attributeName="fill" values="#aeacb9;#D1CFDB;#aeacb9" dur="20s" repeatCount="indefinite"/> </path> <path d="M35,26 l5,-4 l7,23 h-4" fill="#ceced8" stroke-width="0"> <animate attributeName="fill" values="#ceced8;#E5E5EC;#ceced8" dur="20s" repeatCount="indefinite"/> </path> <path d="M47,45 l3,-6 l-10,-17" fill="#ffffed" stroke-width="0"> <animate attributeName="fill" values="#ffffed;#ffffff;#ffffed" dur="20s" repeatCount="indefinite"/> </path> <path d="M57,69 l-4,-20 v35" fill="#5d2042" stroke-width="0"> <animate attributeName="fill" values="#5d2042;#B07F2A;#5d2042" dur="20s" repeatCount="indefinite"/> </path> <path d="M53,49 l-3,1 l3,24" fill="#652343" stroke-width="0"> <animate attributeName="fill" values="#652343;#CE9C46;#652343" dur="20s" repeatCount="indefinite"/> </path> <path d="M53,49 l-3,-10 l-3,6" fill="#5d2042" stroke-width="0"> <animate attributeName="fill" values="#5d2042;#B07F2A;#5d2042" dur="20s" repeatCount="indefinite"/> </path> <path d="M47,45 l3,5 l3,-1" fill="#652343" stroke-width="0"> <animate attributeName="fill" values="#652343;#DDAC58;#652343" dur="20s" repeatCount="indefinite"/> </path> <path d="M50,50 l-8,3 l11,19" fill="#411842" stroke-width="0"> <animate attributeName="fill" values="#411842;#976C24;#411842" dur="20s" repeatCount="indefinite"/> </path> <path d="M42,53 l4,20 l7,-1" fill="#5d2042" stroke-width="0"> <animate attributeName="fill" values="#5d2042;#B07F2A;#5d2042" dur="20s" repeatCount="indefinite"/> </path> <path d="M42,53 l-1,-5 l9,2" fill="#3e1743" stroke-width="0"> <animate attributeName="fill" values="#3e1743;#845E1E;#3e1743" dur="20s" repeatCount="indefinite"/> </path> <path d="M41,48 l6,-3 l3,5" fill="#421943" stroke-width="0"> <animate attributeName="fill" values="#421943;#D6A145;#421943" dur="20s" repeatCount="indefinite"/> </path> <path d="M41,48 l-3,-15 l9,12" fill="#5d2042" stroke-width="0"> <animate attributeName="fill" values="#5d2042;#B07F2A;#5d2042" dur="20s" repeatCount="indefinite"/> </path> <path d="M41,48 l-9,8 l-4,-14 l10,-9" fill="#3d1744" stroke-width="0"> <animate attributeName="fill" values="#3d1744;#7A5006;#3d1744" dur="20s" repeatCount="indefinite"/> </path> <path d="M33,71 l3,-18.6 l5,-4.4 l6,28" fill="#320e40" stroke-width="0"> <animate attributeName="fill" values="#320e40;#5B3C07;#320e40" dur="20s" repeatCount="indefinite"/> </path> <path d="M23,68 l5,-26 l4,14 l4,-3.6 l-3,23" fill="#3b1642" stroke-width="0"> <animate attributeName="fill" values="#3b1642;#684406;#3b1642" dur="20s" repeatCount="indefinite"/> </path> <path d="M28,42 l-10,30 h4.5" fill="#320e40" stroke-width="0"> <animate attributeName="fill" values="#320e40;#5B3C07;#320e40" dur="20s" repeatCount="indefinite"/> </path> <rect x="0", y="75", width="100", height="25" fill="#597252"> <animate attributeName="fill" values="#597252;#96BF6A;#597252" dur="20s" repeatCount="indefinite"/> </rect> <path d="M8,78 l-8,5 v18 h25 l37,-25 l-10,-4" fill="#42513E" stroke-width="0"/> <path d="M23,68 l-15,10 l18,-8" fill="#536a50" stroke-width="0"> <animate attributeName="fill" values="#536a50;#748B5F;#536a50" dur="20s" repeatCount="indefinite"/> </path> <path d="M8,78 l15,-2 l10,-5, l-7,-1" fill="#4f654f" stroke-width="0"> <animate attributeName="fill" values="#4f654f;#65885C;#4f654f" dur="20s" repeatCount="indefinite"/> </path> <path d="M33,71 l3,1 l-9,10 l-4,-6" fill="#526D4A" stroke-width="0"> <animate attributeName="fill" values="#526D4A;#639554;#526D4A" dur="20s" repeatCount="indefinite"/> </path> <path d="M27,82 h13 l-4,-10" fill="#748857" stroke-width="0"> <animate attributeName="fill" values="#748857;#96A658;#748857" dur="20s" repeatCount="indefinite"/> </path> <path d="M40,82 l6,-9 l-10,-1" fill="#88945a" stroke-width="0"> <animate attributeName="fill" values="#88945a;#B1B05A;#88945a" dur="20s" repeatCount="indefinite"/> </path> <path d="M40,82 l18,-5 l-12,-4" fill="#748857" stroke-width="0"> <animate attributeName="fill" values="#748857;#96A658;#748857" dur="20s" repeatCount="indefinite"/> </path> <path d="M58,77 l-5,-5 l-7,1" fill="#7d8f57" stroke-width="0"> <animate attributeName="fill" values="#7d8f57;#A2B255;#7d8f57" dur="20s" repeatCount="indefinite"/> </path> <path d="M58,77 l4,-1 l-5,-7 l-4,3" fill="#9b9d57" stroke-width="0"> <animate attributeName="fill" values="#9b9d57;#BCAF52;#9b9d57" dur="20s" repeatCount="indefinite"/> </path> <circle class="star" cx="75" cy="50" r=".3" fill="white"> <animate attributeName="opacity" values="1;0;0;1" dur="20s" repeatCount="indefinite"/> </circle> <circle class="star" cx="7" cy="25" r=".2" fill="white"> <animate attributeName="opacity" values="1;0;0;1" dur="20s" repeatCount="indefinite"/> </circle> <circle class="star" cx="70" cy="15" r=".4" fill="white"> <animate attributeName="opacity" values="1;0;0;1" dur="20s" repeatCount="indefinite"/> </circle> <circle class="star" cx="62" cy="35" r=".3" fill="white"> <animate attributeName="opacity" values="1;0;0;1" dur="20s" repeatCount="indefinite"/> </circle> <circle class="star" cx="80" cy="22" r=".2" fill="white"> <animate attributeName="opacity" values="1;0;0;1" dur="20s" repeatCount="indefinite"/> </circle> <circle class="star" cx="16" cy="45" r=".2" fill="white"> <animate attributeName="opacity" values="1;0;0;1" dur="20s" repeatCount="indefinite"/> </circle> <circle class="star" cx="20" cy="30" r=".5" fill="white"> <animate attributeName="opacity" values="1;0;0;1" dur="20s" repeatCount="indefinite"/> </circle> <circle class="star" cx="45" cy="24" r=".5" fill="white"> <animate attributeName="opacity" values="1;0;0;1" dur="20s" repeatCount="indefinite"/> </circle> <circle cx="70" cy="24" r="6" fill="white"> <animate attributeName="fill" values="#FFF7A7;white;#FFF7A7" dur="20s" repeatCount="indefinite"/></circle> <ellipse cx="63" cy="28" rx="5" ry="2" fill="white"> <animate attributeName="cx" values="63;55;63" dur="20s" repeatCount="indefinite"/></ellipse> <ellipse cx="61" cy="27" rx="5" ry="3" fill="white"> <animate attributeName="cx" values="61;53;61" dur="20s" repeatCount="indefinite"/></ellipse> <ellipse cx="58" cy="28" rx="5" ry="2" fill="white"> <animate attributeName="cx" values="58;50;58" dur="20s" repeatCount="indefinite"/></ellipse> <ellipse cx="76" cy="18" rx="5" ry="2" fill="white"> <animate attributeName="cx" values="76;85;76" dur="20s" repeatCount="indefinite"/></ellipse> <ellipse cx="79" cy="19" rx="5" ry="3" fill="white"> <animate attributeName="cx" values="79;88;79" dur="20s" repeatCount="indefinite"/></ellipse> <ellipse cx="81" cy="18" rx="5" ry="2" fill="white"> <animate attributeName="cx" values="81;89;81" dur="20s" repeatCount="indefinite"/></ellipse> <img src="https://i.imgur.com/bTQhzza.png"> </body> </html>