QE C’Thx (Copy 6874) (Branch 6958) – CODEBOX

QE C’Thx (Copy 6874) (Branch 6958)

✨ PITHAWAT NUCKONG

<html>
  <style>
    body {
  		background: grey;
  		margin: 1rem;
  		text-align: center;
  		font-family: sans-serif;
	}
	svg {
  		width: 100%;
      margin-bottom: 1rem;
	}
  </style>
  <body>

<svg viewBox="0 0 100 100"> 
      <defs>
        <pattern id="flip" viewBox="0 0 10 10" patternUnits="userSpaceOnUse" x="0" y="0" width="10" height="10">
          <rect width="100" height="100" fill="black">
            <animate attributeName="fill" values="#804141; #5c3d2d; #5c3d2d; #5e5b2e; #5e5b2e; #456932; #456932; #316653; #316653" dur="5s" repeatCount="indefinite"/>
          </rect>
          <path fill="transparent" stroke-width="1" stroke="white">
            <animate attributeName="d" values="M0,0 L10,10 M10,0 L0,10;
                                               M5,0 L5,10 M10,5 L0,5;
                                               M5,0 L5,10 M10,5 L0,5;
                                               M10,0 L0,10 M10,10 L0,0;
                                               M10,0 L0,10 M10,10 L0,0;
                                               M10,5 L0,5 M5,10 L5,0;
                                               M10,5 L0,5 M5,10 L5,0;
                                               M10,10 L0,0 M0,10 L10,0;
                                               M10,10 L0,0 M0,10 L10,0;"
                                       dur="5s" repeatCount="indefinite"/>
            <animate attributeName="stroke" values="#ff8080; #ffa77a; #ffa77a; #fff67a; #fff67a; #a9ff7a; #a9ff7a; #456932; #456932" dur="5" repeatCount="indefinite"/>
          </path>
        </pattern>
      </defs>
      <rect fill="url(#flip)" width="100" height="100"/>
    </svg>

<svg viewBox="0 0 100 100" style="background: #80DEEA"> 
      <defs>
        <pattern id="wow"
                 viewBox="0 0 10 10"
                 patternUnits="userSpaceOnUse"
                 x="0" y="0"
                 width="10" height="10">
          <path stroke="#5E35B1" fill="white"
                stroke-linejoin="square"
                d="m5,3 l2,2 l-2,2 l-2,-2 z"></path>
          <pattern id="wow2"
                 viewBox="0 0 10 10"
                 patternUnits="userSpaceOnUse"
                 x="0" y="0"
                 width="10" height="10">
          <path stroke="#311B92" fill="transparent"
                stroke-linejoin="square"
                d="m5,0.5 l4.5,4.5 l-4.5,4.5 l-4.5,-4.5 z"><animate attributeName="d" 
                     values="
                             m5 0.5
                             l4.5 4.5
                             l-4.5 4.5
                             l-4.5 -4.5
            					  z;
                             m5 1
                             l4 4
                             l-4 4
                             l-4 -4
                             z;
            						m5 0.5
                             l4.5 4.5
                             l-4.5 4.5
                             l-4.5 -4.5
            					  z;" dur="2s" 
                     repeatCount="indefinite" /></path>
          <pattern id="wow3"
                 viewBox="0 0 10 10"
                 patternUnits="userSpaceOnUse"
                 x="0" y="0"
                 width="10" height="10">
          <path stroke="#ffcdd2" fill="transparent"
                stroke-linejoin="round"
                stroke-width="0.5"
                d="m0,0 l5,5 l-5,5"/>
          <pattern id="wow4"
                 viewBox="0 0 10 10"
                 patternUnits="userSpaceOnUse"
                 x="0" y="0"
                 width="10" height="10">
          <path stroke="#ffcdd2" fill="transparent"
                stroke-linejoin="round"
                stroke-width="0.5"
                d="m10,0 l-5,5 l5,5"/>
          <pattern id="wow5"
                 viewBox="0,0,10,10" width="10%" height="10%">
          <circle r="2" cx="10" cy="0" fill="#4FC3F7"/>
          <circle r="2" cx="0" cy="10" fill="#4FC3F7"/>
          <circle r="2" cx="10" cy="10" fill="#4FC3F7"/>
          <circle r="2" cx="0" cy="0" fill="#4FC3F7"/>
          <path stroke="#ffcdd2" fill="transparent"
                stroke-linejoin="round"
                stroke-width="0.5"
                d="m10,0 l-5,5 l5,5"/>
            <path stroke="#ffcdd2" fill="transparent"
                stroke-linejoin="round"
                stroke-width="0.5"
                d="m0,0 l5,5 l-5,5"/>
        </defs>
      <rect fill="url(#wow)" 
            width=100 height="100"/>
        <rect fill="url(#wow2)" 
            width=100 height="100"/>
        <rect fill="url(#wow3)"
              width="100" height="100"/>
			<rect fill="url(#wow4)"
              width="100" height="100"/>
          <rect fill="url(#wow5)"
            width="100" height="100"/> 
      </defs>
    </svg> 
            
          
            
            
<svg viewBox="0 0 100 100" style="background: ">  
  <defs>
    <pattern id="bro" viewBox="0,0,10,10" width="10%" height="10%">
    <rect width="10" height="10" fill="#FFAC3BE8"/>
    <circle cx="0" cy="0" r="4" stroke="black" stroke-width="1" fill="white" />
	 <circle cx="0" cy="0" r="3" stroke="white" stroke-width="1" fill="red" />
	 <circle cx="10" cy="0" r="3" stroke="white" stroke-width="1" fill="yellow" />
	 <circle cx="0" cy="10" r="3" stroke="white" stroke-width="1" fill="yellow" />
    <circle cx="10" cy="10" r="4" stroke="black" stroke-width="1" fill="white" />
    <circle cx="10" cy="10" r="3" stroke="white" stroke-width="1" fill="red" />
    <circle cx="5" cy="5" r="1" stroke="#000000" stroke-width="1" fill="#64DD95" />
    </pattern>
  </defs>

<rect x="0" y="0" width="100" height="100" fill="url(#bro)" />
</svg>  
          
            
            
            
    <svg viewBox="0 0 100 100">  
      <defs>
        <pattern id="nezuko_pattern"
                 viewBox="0 0 6 4"
                 patternUnits="userSpaceOnUse"
                 x="-1" y="0"
                 width="6" height="4"
                 >
          <rect width="100" height="100" fill="#f6b9be"/>
          <path stroke="#84474c" fill="transparent" stroke-width=".1"
                  d="M0,2 L1,0 L3,0 L2,2 L0,2 L3,0 
                     M0,2 L1,4 L3,4 L2,2 L0,2 L3,4 
                     M3,0 L4,2 L6,2 L3,0 L5,0 L6,2 
                     M3,4 L4,2 L6,2 L3,4 L5,4 L6,2 
                     M3,4 L3,0 
                     M6,0 L6,4 
                     M0,0 L0,4">
        </pattern>
      </defs>
      <rect fill="url(#nezuko_pattern)" width="100" height="100"/>
    </svg>

<svg viewBox="0 0 100 100" style="background-color:#FF711140">  
  <defs>
    <pattern id="star" viewBox="0,0,10,10" width="10%" height="10%">
    <rect width="10" height="10" fill="#FFAC3BE8" stroke="#FF7111"/>
    <circle cx="0" cy="0" r="4" stroke="green" stroke-width="1" fill="yellow" />
    <circle cx="10" cy="10" r="4" stroke="green" stroke-width="1" fill="yellow" />
    <circle cx="10" cy="10" r="4" stroke="green" stroke-width="1" fill="yellow" />
    <path d="M0 10 L10 0 L3.5 3.5 Z" stroke="#A2F722" stroke-width="0.5" fill="#B0F431" />
    <path d="M0 10 L10 0 L6.5 6.5 Z" stroke="#A2F722" stroke-width="0.5" fill="#B0F431" />
    <circle cx="5" cy="5" r="1" stroke="#42BBFF" stroke-width="0.5" fill="#36FFA8" />
    </pattern>
  </defs>

<rect x="0" y="0" width="100" height="100" fill="url(#star)" />
</svg>  
      
      
<svg viewBox="0 0 100 100" style="background:linear-gradient(#e66465, #9198e5)">
      
      <defs>
    <pattern id="star2"
                 viewBox="0 0 10 10"
                 patternUnits="userSpaceOnUse"
                 x="0" y="0"
                 width="10" height="10">
      <path stroke="#F9A825" fill="#F9A825"
                stroke-linejoin="square"
                d="m6,4 l-1,-2 l-1,2 h-1.5 l1,2 v2 l1.5,-2 l1.5,2 v-2 l1,-2 h-1z"></path>
    </pattern>
    <pattern id="add"
                 viewBox="0 0 10 10"
                 patternUnits="userSpaceOnUse"
                 x="0" y="0"
                 width="10" height="10">
      <path stroke="#212121" fill="#212121"
                stroke-linejoin="square">
                <animate attributeName="d" values="
                m0,0 h10 l-10,10 v10 z;
                m0,0 h0 l10,10 v-10  z;
                m0,0 h10 l-10,10 v10 z" dur="5s" repeatCount="indefinite" /></path>
    </pattern>
  </defs>
 <rect fill="url(#star2)" 
            width=100 height="100"/>
 <rect fill="url(#add)" 
            width=100 height="100"/>
      
    </svg>
<svg viewBox="0 0 100 100" style="background:black">
      
      <defs>
    <pattern id="moon"
                 viewBox="0 0 64 64"
                 patternUnits="userSpaceOnUse"
                 x="0" y="0"
                 width="10" height="10">
      <path stroke="#00000" fill="white"
                stroke-linejoin="square"
                d="M36.4 20.4a16 16 0 1 0 16 16 16 16 0 0 0-16-16zm0 28a12 12 0 0 1-10.3-5.8l2.5.3A13.7 13.7 0 0 0 42 25.8a12 						12 0 0 1-5.6 22.6
                  M36.4 16.4a2 2 0 0 0 2-2v-8a2 2 0 1 0-4 0v8a2 2 0 0 0 2 2zm-20 20a2 2 0 0 0-2-2h-8a2 2 0 0 0 0 4h8a2 2 0 0 0 						 2-2zm3-14.1a2 2 0 0 0 2.8-2.8l-5.7-5.7a2 2 0 0 0-2.8 2.8zM59 13.8a2 2 0 0 0-2.8 0l-5.7 5.7a2 2 0 1 0 2.8 							2.8l5.7-5.7a2 2 0 0 0 0-2.8zM19.4 50.5l-5.7 5.7a2 2 0 1 0 2.9 2.8l5.7-5.7a2 2 0 1 0-2.8-2.8z"></path>
    </pattern>
    <pattern id="add"
                 viewBox="0 0 10 10"
                 patternUnits="userSpaceOnUse"
                 x="0" y="0"
                 width="10" height="10">
    </pattern>
  </defs>
 <rect fill="url(#moon)" 
            width=100 height="100"/>
</svg>
  </body>
</html>