test
✨ Athichart Chusri
<html> <head> <title>ก้อง อธิชาติ ชูศรี(63070181)</title> </head> <style> body { margin: 0; text-align:center; background:#23BB94; } svg { width: 100%; } .roll{ animation:mhun 3s infinite alternate} @keyframes mhun { 0%{ transform:translateX(100px)} /* 25%{ transform:translateX(75px)} 50%{ transform:translateX(50px)} 75%{ transform:translateX(25px)} */ 100%{ transform:translateX(0px)} } .roll2{ animation:mhun2 3s infinite alternate} @keyframes mhun2 { 0%{ transform:translateX(70px)} /* 25%{ transform:translateX(75px)} 50%{ transform:translateX(50px)} 75%{ transform:translateX(25px)} */ 100%{ transform:translateX(0px)} } .roll3{ animation:mhun3 3s infinite alternate} @keyframes mhun3 { 0%{ transform:translateX(50px)} /* 25%{ transform:translateX(75px)} 50%{ transform:translateX(50px)} 75%{ transform:translateX(25px)} */ 100%{ transform:translateX(0px)} } </style> <body> <svg viewBox="0 0 200 200"> <defs> <pattern id="wave1" viewBox="0,0,20,20" width="50%" height="50%"> <rect width="20" height="20" fill="white"> </rect> <path d="M 0 0 v10 h10 v-10 h-10" fill="black" /> <path d="M 0 0 v20 h10 v-10 h-10" fill="#DAF7A6" /> <path d="M 10 0 v20 h10 v-10 h-10" fill="black" /> <path d="M 10 0 v10 h10 v-10 h-10" fill="#DAF7A6" /> </pattern> </defs> <rect width="100%" height="100%" fill="url(#wave1)"/> --- ผลงานของคุณ --- <svg> <path d="M38,80 L52,66 L41,65 z" fill="#9d894c"/> <path d="M38,80 L49,82 L56,76 L51,66" fill="#ae956a"/> <path d="M38,80 L42,98 L58,92 L49,82" fill="#a88d58"/> <path d="M58,92 L49,113 L42,97" fill="#9b7949"/> <path d="M58,92 L65,87 L67,82 L56,76 L49,82" fill="#9d7f40"/> <path d="M67,82 L67,91 L65,87" fill="#836737"/> <path d="M65,87 L67,91 L58,92" fill="#8c6f34"/> <path d="M58,92 L61,111 L49,113" fill="#a28041"/> <path d="M58,92 L65,98 L61,111" fill="#977837"/> <path d="M58,92 L67,91 L65,98" fill="#a28f4d"/> <path d="M49,113 L60,123 L70,115 L61,111" fill="#705930"/> <path d="M65,98 L68,103 L78,105 L70,115 L61,111" fill="#a8904a"/> <path d="M49,113 L46,128 L61,129 L60,123" fill="#7e632b"/> <path d="M70,115 L70,123 L61,129 L60,123" fill="#b79b51"/> <path d="M46,128 L47,137 L61,129" fill="#895e10"/> <path d="M47,137 L47,148 L60,137" fill="#7b550e"/> <path d="M61,129 L68,135 L60,137 L47,137" fill="#976f26"/> <path d="M60,137 L63,147 L68,135" fill="#825e2a"/> <path d="M70,123 L68,135 L61,129" fill="#765824"/> <path d="M63,147 L60,137 L47,148" fill="#644e26"/> <path d="M47,148 L44,156 L52,156 L63,147" fill="#a28129"/> <path d="M51,66 L78,84 L67,82 L56,76" fill="#ac9044"/> <path d="M63,147 L89,138 L96,156 L52,156" fill="#e0cf99"/> <path d="M96,156 L104,154 L89,138" fill="#c6b678"/> <path d="M96,156 L104,156 L104,154" fill="#b5a66f"/> <path d="M63,147 L68,135 L89,138" fill="#c6b887"/> <path d="M78,105 L78,119 L89,138 L68,135 L70,123 L70,115" fill="#d7c796"/> <path d="M104,156 L127,156 L128,153 L104,154" fill="#b4a770"/> <path d="M128,153 L89,138 L104,154" fill="#ad9c66"/> <path d="M128,153 L121,139 L89,138" fill="#9e8d59"/> <path d="M51,66 L69,70 L78,84" fill="#50371a"/> <path d="M69,70 L81,81 L78,84" fill="#685432"/> <path d="M69,70 L80,77 L81,81" fill="#433319"/> <path d="M67,82 L67,91 L78,84" fill="#62522f"/> <path d="M81,81 L85,91 L78,88 L67,91 L78,84" fill="#c8b279"/> <path d="M81,81 L86,76 L80,77" fill="#938357"/> <path d="M86,76 L91,92 L81,81" fill="#d0b67d"/> <path d="M81,81 L91,92 L85,91" fill="#dec794"/> <path d="M91,92 L89,97 L86,95 L85,91" fill="#d5b77c"/> <path d="M89,97 L85,102 L86,95" fill="#856c4d"/> <path d="M85,102 L78,105 L87,108 z" fill="#d2bc89"/> <path d="M67,91 L70,94 L65,98" fill="#4e3c16"/> <path d="M70,94 L68,103 L65,98" fill="#5e4c2e"/> <path d="M67,91 L70,94 L78,91 L78,88 z" fill="#3a352f"/> <path d="M78,88 L85,91 L86,95 L78,91" fill="#1a0c16"/> <path d="M70,94 L74,97 L74,101 L68,103" fill="#81702a"/> <path d="M70,94 L74,97 L78,95 L78,91" fill="#907e35"/> <path d="M78,95 L81,97 L86,95 L78,91" fill="#a08d39"/> <path d="M86,95 L85,102 L81,100 L81,97" fill="#968126"/> <path d="M85,102 L78,105 L78,104 L81,100" fill="#9e9131"/> <path d="M68,103 L74,101 L78,104 L78,105" fill="#6f6b21"/> <path d="M74,97 L78,95 L81,97 L81,100 L78,104 L74,101 z" fill="#010306"/> <path d="M76,99 L75,100 L77,101 L77,99 L78,99 L78,98 L77,98 L77,99"fill="#feffe8"/> <path d="M87,108 L78,119 L78,105" fill="#ead9a9"/> <path d="M86,76 L99,81 L91,92" fill="#e2d4a7"/> <path d="M86,76 L93,75 L99,81" fill="#d6c797"/> <path d="M99,81 L106,89 L100,94 L91,92" fill="#e1cfa1"/> <path d="M100,94 L89,97 L91,92" fill="#dbc595"/> <path d="M89,97 L85,102 L87,108 L91,102 L93,96" fill="#e5d6ad"/> <path d="M91,102 L99,103 L97,112 L87,108" fill="#dccd9e"/> <path d="M87,108 L97,112 L78,119" fill="#d4c290"/> <path d="M97,112 L90,125 L78,119" fill="#c9b787"/> <path d="M78,119 L90,125 L89,138" fill="#af9f74"/> <path d="M90,125 L95,130 L89,138" fill="#9f8d5f"/> <path d="M95,130 L103,137 L89,138" fill="#bdad7a"/> <path d="M89,138 L103,137 L121,139" fill="#9f8f5b"/> <path d="M90,125 L99,121 L95,130" fill="#9d7f65"/> <path d="M90,125 L99,121 L97,112" fill="#aa8c67"/> <path d="M97,112 L103,113 L99,121" fill="#b58557"/> <path d="M95,130 L109,128 L121,139 L103,137" fill="#bba069"/> <path d="M109,128 L121,128 L121,139" fill="#bda977"/> <path d="M 106 89 L 106 93 L 100 94" fill="#d1b98a"/> <!-- ครึ่งหลัง --> <path d="M93,75 L103,74 L99,81" fill="#e1d39e"/> <path d="M103,74 L106,89 L99,81" fill="#cbbd89"/> <path d="M103,74 L112,75 L106,89" fill="#c0a877"/> <path d="M103,74 L111,73 L112,75" fill="#77673d"/> <path d="M112,75 L121,82 L115,84 L112,75" fill="#7b642f"/> <path d="M112,75 L115,84 L110,88 L111,93 L106,89" fill="#baa46a"/> <path d="M106,89 L111,93 L117,98 L121,103 L118,109 L111,108 L111,98 L108,94 L106,93" fill="#cdbf90"/> <path d="M111,98 L106,101 L111,108" fill="#d8c490"/> <path d="M106,101 L104,107 L111,108" fill="#c5a771"/> <path d="M99,103 L103,107 L97,112" fill="#cf9f5e"/> <path d="M103,107 L103,113 L97,112" fill="#c19659"/> <path d="M104,107 L106,113 L111,108" fill="#c08e5a"/> <path d="M111,108 L112,117 L106,113" fill="#aa864b"/> <!-- จมูก --> <path d="M93,96 L97,99 L91,102" fill="#d68825"/> <path d="M93,96 L100,94 L97,99" fill="#e2a35b"/> <path d="M100,94 L99,100 L97,99" fill="#f38a3e"/> <path d="M91,102 L97,99 L99,100 z" fill="#ac4115"/> <path d="M99,100 L99,103 L91,102" fill="#491007"/> <path d="M100,94 L104,98 L103,105 L99,100" fill="#da732f"/> <path d="M99,100 L99,103 L103,107 L103,105" fill="#da6433"/> <path d="M106,101 L104,98 L111,98" fill="#2d0f00"/> <path d="M104,98 L105,97 L111,98" fill="#6b2409"/> <path d="M111 98 L108,94 L106,93 L105,97" fill="#c98535"/> <path d="M100 94 L106,93 L105,97 L104,98" fill="#dd904f"/> <path d="M104,98 L106,101 L104,107 L103,105" fill="#c35929"/> <path d="M106,113 L105,114 L103,113 L103,107 L103,105 L104,107" fill="#b35d25"/> <path d="M95,130 L101,123 L106,121 L111,122 L109,128" fill="#9c701d"/> <path d="M111,122 L117,125 L121,128 L109,128" fill="#a8864d"/> <path d="M118,109 L112,117 L111,108" fill="#c0ab7c"/> <path d="M118,109 L125,116 L112,117" fill="#c7b583"/> <path d="M125,116 L117,125 L112,117" fill="#a59363"/> <path d="M125,116 L121,128 L117,125" fill="#b7a478"/> <path d="M112,117 L105,114 L106,113" fill="#6c411f"/> <path d="M103,113 L105,114 L99,121" fill="#733d21"/> <path d="M105,114 L106,118 L112,117" fill="#402418"/> <path d="M105,114 L106,118 L106,121 L101,123 L99,121" fill="#251d10"/> <path d="M99,121 L101,123 L95,130" fill="#432a15"/> <path d="M106,118 L112,117 L117,125 L111,122 L106,121" fill="#09080f"/> <!-- เปลี่ยนสี --> <path d="M121,128 L128,133 L121,139" fill="rgba(244,114,140,255)" class="roll"/> #a58f4d <path d="M112,75 L128,79 L125,83 L121,82" fill="rgba(162,0,134,1)" class="roll2"/> <path d="M112,75 L117,62 L128,79" fill="rgba(187,1,126,255)" class="roll"/> <path d="M117,62 L111,73 L112,75" fill="rgba(243,0,152,255)" class="roll3"/> <path d="M117,62 L133,68 L128,79" fill="rgba(154,5,133,255)" class="roll2"/> <path d="M 117,62 L126,50 L133,68" fill="rgba(198,23,167,255) " class="roll3"/> <path d="M126,50 L135,47 L142,71 L133,68" fill="rgba(179,0,106,255)" class="roll"/> <path d="M133,68 L142,71 L128,79" fill="rgba(198,23,167,255)" class="roll3"/> <path d="M142,71 L144,82 L128,79" fill="rgba(178,2,104,255)" class="roll2"/> <path d="M125,83 L131,92 L139,91 L128,79" fill="rgba(255,87,180,255)"class="roll2"/> <path d="M131,92 L126,96 L130,102 L135,96 L131,92" fill="rgba(178,2,104,255)"class="roll3"/> <path d="M128,79 L144,82 L147,92 L139,91" fill="rgba(204,1,129,255)"class="roll"/> <path d="M139,91 L135,96 L131,92" fill="rgba(162,0,134,0.8)" class="roll"/> <path d="M126,96 L123,97 L130,102" fill="rgba(248,73,128,255)"class="roll"/> <path d="M123,97 L117,98 L121,103 L130,102" fill="rgba(255,127,162,255)" class="roll"/> <path d="M130,102 L136,110 L127,110 L121,103" fill="rgba(244,0,100,255)"class="roll2"/> <path d="M121,103 L127,110 L125,116 L118,109" fill="rgba(218,0,79,255)" class="roll"/> <path d="M147,92 L142,102 L139,91" fill="rgba(226,0,162,255)" class="roll2"/> <path d="M139,91 L136,103 L142,102" fill="rgba(239,0,67,255)"class="roll"/> <path d="M139,91 L130,102 L136,103" fill="rgba(239,8,98,255)"class="roll2"/> <path d="M147,92 L153,102 L142,102" fill="#fb6da7"class="roll3"/> <path d="M130,102 L136,103 L136,110" fill="rgba(255,98,193,255)"class="roll"/> <path d="M142,102 L136,110 L136,103" fill="rgba(255,127,162,255)"class="roll3"/> <path d="M125,116 L136,110 L127,110" fill="rgba(254,156,206,255)"class="roll"/> <path d="M125,116 L134,128 L128,133 L121,128" fill="rgba(251,150,154,255)"class="roll"/> <path d="M153,102 L148,110 L142,102" fill="rgba(255,109,136,255)"class="roll2"/> <path d="M153,102 L158,110 L148,110" fill="rgba(245,113,214,255)"class="roll3"/> <path d="M142,102 L148,110 L136,110" fill="rgba(254,58,200,255)"class="roll"/> <path d="M158,110 L147,119 L148,110" fill="rgba(250,122,241,255)"class="roll3"/> <path d="M148,110 L136,110 L147,119" fill="rgba(252,115,211,255)"class="roll2"/> <path d="M136,110 L139,119 L125,116" fill="#f9a1fa" class="roll3"/> <path d="M139,119 L147,119 L136,110" fill="rgba(255,140,199,255)"class="roll3"/> <path d="M125,116 L139,119 L134,128" fill="rgba(255,187,253,255)"class="roll"/> <path d="M158,110 L159,121 L147,119" fill="rgba(255,180,248,255)"class="roll3"/> <path d="M139,119 L144,129 L134,128" fill="rgba(254,177,211,255)"class="roll2"/> <path d="M139,119 L147,119 L144,129" fill="rgba(213,147,255,255)"class="roll"/> <path d="M147,119 L159,131 L159,121" fill="rgba(236,183,253,255)"class="roll3"/> <path d="M147,119 L144,129 L159,131" fill="rgba(213,147,255,255)"class="roll3"/> <path d="M159,121 L165,132 L159,131" fill="rgba(204,115,255,255)"class="roll2"/> <path d="M165,132 L153,139 L144,129" fill="rgba(167,59,255,255)" class="roll"/> <path d="M128,133 L145,143 L153,139 L144,129 L134,128" fill="rgba(251,207,250,255)" class="roll3"/> <path d="M128,133 L145,143 L128,153 L121,139" fill="rgba(198,175,253,255)"class="roll"/> <path d="M 165 132 L 163 144 L 153 139" fill="rgba(152,105,252,255)"class="roll"/> <path d="M153,139 L163,144 L145,143" fill="rgba(172,149,253,255)"class="roll3"/> <path d="M163,144 L158,156 L145,143" fill="rgba(198,175,253,255)"class="roll2"/> <path d="M163,144 L166,156 L158,156" fill="rgba(172,170,245,255)"class="roll"/> <path d="M145,143 L141,156 L158,156" fill="rgba(187,201,255,255)"class="roll3"/> <path d="M145,143 L141,156 L127,156 L128,153" fill="rgba(116,149,254,255)"class="roll2"/> </svg> <!-- ตาขวา --> <svg> <path d="M121,82 L121,84 L116,86 L115,84" fill="black"/> <path d="M121,84 L124,85 L125,83 L121,82" fill="black"/> <path d="M125,83 L124,85 L127,89 L129,89" fill="black"/> <path d="M129,89 L131,92 L128,92 L127,89" fill="black"/> <path d="M131,92 L128,92 L126,96" fill="black"/> <path d="M115,84 L116,86 L112,89 L111,93 L110,88" fill="black"/> <path d="M112,89 L116,90 L116,92 L111,93" fill="#FFEF7E"/> <path d="M116,86 L118,88 L116,90 L112,89" fill="#FFEF7E"/> <path d="M116,86 L121,84 L120,87 L118,88" fill="#FFEF7E"/> <path d="M127,89 L124,91 L120,87 L121,84 L124,85" fill="#FFEF7E"/> <path d="M127,89 L124,91 L124,93 L126,96 L128,92" fill="#FFEF7E"/> <path d="M126,96 L124,93 L122,96 L123,97" fill="#FFEF7E"/> <path d="M116,92 L119,95 L117,98 L111,93" fill="#FFEF7E"/> <path d="M119,95 L122,96 L123,97 L117,98" fill="#FFEF7E"/> <path d="M120,87 L124,91 L124,93 L122,96 L119,95 L116,92 L116,90 L118,88" fill="black"/> <path d="M118,90 L119,91 L116,94 L115,92 L116,91 L117,91 L118,90" fill="white"/> </svg> <!-- snow left --> <svg x="10" y="0"> <circle cx="7" cy="8" r="2" fill="white"> <animate attributeName="cy" values="8;150" dur="2.5s" repeatCount="indefinite" /> </circle> <circle cx="15" cy="15" r="3" fill="pink"> <animate attributeName="cy" values="15;152.5" dur="3s" repeatCount="indefinite" /> </circle> <circle cx="25" cy="5" r="1" fill="white"> <animate attributeName="cy" values="5;150" dur="4.5s" repeatCount="indefinite" /> </circle> <circle cx="35" cy="1" r="2" fill="white"> <animate attributeName="cy" values="1;100" dur="3s" repeatCount="indefinite" /> </circle> <circle cx="30" cy="7" r="2" fill="pink"> <animate attributeName="cy" values="7;142" dur="4s" repeatCount="indefinite" /> </circle> <circle cx="1" cy="0" r="1" fill="pink"> <animate attributeName="cy" values="0;150" dur="3s" repeatCount="indefinite" /> </circle> <circle cx="68" cy="0" r="3" fill="white"> <animate attributeName="cy" values="0;150" dur="4s" repeatCount="indefinite" /> </circle> <circle cx="60" cy="3" r="2" fill="pink"> <animate attributeName="cy" values="3;142" dur="2s" repeatCount="indefinite" /> </circle> <circle cx="45" cy="1" r="1" fill="pink"> <animate attributeName="cy" values="1;150" dur="2.5s" repeatCount="indefinite"/> </circle> <circle cx="65" cy="5" r="1" fill="pink"> <animate attributeName="cy" values="5;142" dur="2.5s" repeatCount="indefinite"/> </circle> </svg> <!-- snow right --> <svg x="110" y="0"> <circle cx="7" cy="8" r="2" fill="white"> <animate attributeName="cy" values="8;150" dur="2.5s" repeatCount="indefinite" /> </circle> <circle cx="15" cy="15" r="3" fill="pink"> <animate attributeName="cy" values="15;152.5" dur="2s" repeatCount="indefinite" /> </circle> <circle cx="25" cy="5" r="1" fill="white"> <animate attributeName="cy" values="5;150" dur="3.5s" repeatCount="indefinite" /> </circle> <circle cx="35" cy="1" r="2" fill="white"> <animate attributeName="cy" values="1;100" dur="3s" repeatCount="indefinite" /> </circle> <circle cx="30" cy="7" r="2" fill="pink"> <animate attributeName="cy" values="7;142" dur="2s" repeatCount="indefinite" /> </circle> <circle cx="1" cy="0" r="1" fill="pink"> <animate attributeName="cy" values="0;150" dur="3s" repeatCount="indefinite" /> </circle> <circle cx="68" cy="0" r="3" fill="white"> <animate attributeName="cy" values="0;150" dur="4s" repeatCount="indefinite" /> </circle> <circle cx="60" cy="3" r="2" fill="pink"> <animate attributeName="cy" values="3;142" dur="2s" repeatCount="indefinite" /> </circle> <circle cx="45" cy="1" r="1" fill="pink"> <animate attributeName="cy" values="1;150" dur="2.5s" repeatCount="indefinite"/> </circle> <circle cx="65" cy="5" r="1" fill="pink"> <animate attributeName="cy" values="5;142" dur="2.5s" repeatCount="indefinite"/> </circle> </svg> </svg> <img src="https://cdn.discordapp.com/attachments/799482345668214786/840289955795828778/catpoly_2.jpg"> </body> </html>