preview/preview.svg

<?xml version="1.0"?>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2048 2048">
	<style>
		@keyframes cycle1 {
			0.0%  {fill: #aa3139}
			6.7%  {fill: #aa295b}
			13.3% {fill: #9d4700}
			20.0% {fill: #a43e00}
			26.7% {fill: #a63919}
			33.3% {fill: #80439e}
			40.0% {fill: #a24100}
			46.7% {fill: #536f00}
			53.3% {fill: #8e5400}
			60.0% {fill: #a53d00}
			66.7% {fill: #a73630}
			73.3% {fill: #a6334c}
			80.0% {fill: #d00069}
			86.7% {fill: #a43f00}
			93.3% {fill: #a7362e}
		}
		@keyframes cycle2 {
			0.0%  {fill: #818800}
			6.7%  {fill: #539500}
			13.3% {fill: #7f8800}
			20.0% {fill: #5f911e}
			26.7% {fill: #868600}
			33.3% {fill: #557ad9}
			40.0% {fill: #748c00}
			46.7% {fill: #659015}
			53.3% {fill: #009958}
			60.0% {fill: #c65c29}
			66.7% {fill: #c9583d}
			73.3% {fill: #009b8f}
			80.0% {fill: #009e03}
			86.7% {fill: #768b00}
			93.3% {fill: #469538}
		}
		@keyframes cycle3 {
			0.0%  {fill: #a67600}
			6.7%  {fill: #977f00}
			13.3% {fill: #927b66}
			20.0% {fill: #987b3c}
			26.7% {fill: #96786b}
			33.3% {fill: #c54d8d}
			40.0% {fill: #9a785b}
			46.7% {fill: #728b35}
			53.3% {fill: #937d49}
			60.0% {fill: #c85a39}
			66.7% {fill: #ae6a6b}
			73.3% {fill: #74847d}
			80.0% {fill: #ac7500}
			86.7% {fill: #af700e}
			93.3% {fill: #967c3b}
		}
		@keyframes cycle4 {
			0.0%  {fill: #4f7595}
			6.7%  {fill: #4a7a84}
			13.3% {fill: #776d77}
			20.0% {fill: #607677}
			26.7% {fill: #6c7277}
			33.3% {fill: #5e6fa1}
			40.0% {fill: #4c7b79}
			46.7% {fill: #68765f}
			53.3% {fill: #6a7568}
			60.0% {fill: #8e57a2}
			66.7% {fill: #816a70}
			73.3% {fill: #6b727b}
			80.0% {fill: #1675be}
			86.7% {fill: #008280}
			93.3% {fill: #756f70}
		}
		@keyframes cycle5 {
			0.0%  {fill: #84628f}
			6.7%  {fill: #ca0e6e}
			13.3% {fill: #806c69}
			20.0% {fill: #bf3e31}
			26.7% {fill: #a85264}
			33.3% {fill: #855da4}
			40.0% {fill: #7d6e5f}
			46.7% {fill: #637672}
			53.3% {fill: #a35e08}
			60.0% {fill: #ce2310}
			66.7% {fill: #9e5b5d}
			73.3% {fill: #965e6d}
			80.0% {fill: #c6009a}
			86.7% {fill: #c23e00}
			93.3% {fill: #926074}
		}
		@keyframes cycle6 {
			0.0%  {fill: #4e8d85}
			6.7%  {fill: #428c9b}
			13.3% {fill: #857c87}
			20.0% {fill: #88805d}
			26.7% {fill: #7d817d}
			33.3% {fill: #757ea0}
			40.0% {fill: #20918f}
			46.7% {fill: #728b35}
			53.3% {fill: #7e8270}
			60.0% {fill: #927a71}
			66.7% {fill: #777f97}
			73.3% {fill: #00949a}
			80.0% {fill: #0095aa}
			86.7% {fill: #498e83}
			93.3% {fill: #7f7c97}
		}

		@keyframes cycle9 {
			0.0%  {fill: #dd6163}
			6.7%  {fill: #de5b86}
			13.3% {fill: #cf7504}
			20.0% {fill: #d76c38}
			26.7% {fill: #da6849}
			33.3% {fill: #ae70cf}
			40.0% {fill: #d56f2a}
			46.7% {fill: #7e9c1c}
			53.3% {fill: #be8100}
			60.0% {fill: #d86c3a}
			66.7% {fill: #db655b}
			73.3% {fill: #d96277}
			80.0% {fill: #fe0096}
			86.7% {fill: #d66d32}
			93.3% {fill: #db6559}
		}
		@keyframes cycle10 {
			0.0%  {fill: #aeb733}
			6.7%  {fill: #80c500}
			13.3% {fill: #acb734}
			20.0% {fill: #8cc054}
			26.7% {fill: #b4b52d}
			33.3% {fill: #81a9fe}
			40.0% {fill: #a1bb40}
			46.7% {fill: #91bf4f}
			53.3% {fill: #4ac985}
			60.0% {fill: #fa8b5a}
			66.7% {fill: #fd876a}
			73.3% {fill: #00cbbd}
			80.0% {fill: #2acf4a}
			86.7% {fill: #a3ba3e}
			93.3% {fill: #75c467}
		}
		@keyframes cycle11 {
			0.0%  {fill: #f8c55d}
			6.7%  {fill: #e6ce3e}
			13.3% {fill: #e1c8b1}
			20.0% {fill: #e8c988}
			26.7% {fill: #e6c5b6}
			33.3% {fill: #fe9ddc}
			40.0% {fill: #eac5a6}
			46.7% {fill: #beda83}
			53.3% {fill: #e2cb95}
			60.0% {fill: #fea985}
			66.7% {fill: #feb7b7}
			73.3% {fill: #c1d2cb}
			80.0% {fill: #fec600}
			86.7% {fill: #febe6c}
			93.3% {fill: #e6ca88}
		}
		@keyframes cycle12 {
			0.0%  {fill: #6c94b5}
			6.7%  {fill: #6798a3}
			13.3% {fill: #958b95}
			20.0% {fill: #7e9495}
			26.7% {fill: #898f95}
			33.3% {fill: #7a8dc1}
			40.0% {fill: #6a9997}
			46.7% {fill: #85947c}
			53.3% {fill: #879385}
			60.0% {fill: #ad75c3}
			66.7% {fill: #a0878d}
			73.3% {fill: #888f99}
			80.0% {fill: #3d94df}
			86.7% {fill: #35a19f}
			93.3% {fill: #938d8e}
		}
		@keyframes cycle13 {
			0.0%  {fill: #a380ae}
			6.7%  {fill: #ef408c}
			13.3% {fill: #9e8987}
			20.0% {fill: #e25f4f}
			26.7% {fill: #c97082}
			33.3% {fill: #a37ac4}
			40.0% {fill: #9b8c7c}
			46.7% {fill: #80948f}
			53.3% {fill: #c37c34}
			60.0% {fill: #f34c37}
			66.7% {fill: #be7979}
			73.3% {fill: #b67b8a}
			80.0% {fill: #ea31ba}
			86.7% {fill: #e55f2a}
			93.3% {fill: #b17d91}
		}
		@keyframes cycle14 {
			0.0%  {fill: #8bccc3}
			6.7%  {fill: #81cadb}
			13.3% {fill: #c3b9c5}
			20.0% {fill: #c7be99}
			26.7% {fill: #bbbebb}
			33.3% {fill: #b2bce0}
			40.0% {fill: #6bd1cd}
			46.7% {fill: #aeca73}
			53.3% {fill: #bbc0ac}
			60.0% {fill: #d1b7ae}
			66.7% {fill: #b4bdd6}
			73.3% {fill: #46d4d9}
			80.0% {fill: #00d5eb}
			86.7% {fill: #88cdc0}
			93.3% {fill: #bdb9d6}
		}

		text {
			font-weight: bold;
			font-style: italic;
			fill: #5b5b5b;
		}
		.bg {
			fill: white;
			stroke: black;
		}
		.c {
			animation-duration: 15s;
			animation-iteration-count: infinite;
			animation-timing-function: step-end;
		}
		.c1  {animation-name: cycle1}
		.c2  {animation-name: cycle2}
		.c3  {animation-name: cycle3}
		.c4  {animation-name: cycle4}
		.c5  {animation-name: cycle5}
		.c6  {animation-name: cycle6}
		.c9  {animation-name: cycle9}
		.c10 {animation-name: cycle10}
		.c11 {animation-name: cycle11}
		.c12 {animation-name: cycle12}
		.c13 {animation-name: cycle13}
		.c14 {animation-name: cycle14}
	</style>

	<rect x="0" y="0" width="2048" height="2048" stroke-width="3" class="bg" />
	<g>
		<rect x="89" y="85" width="313" height="704" class="c c1" />
		<rect x="401" y="85" width="313" height="704" class="c c2" />
		<rect x="713" y="85" width="313" height="704" class="c c3" />
		<rect x="1025" y="85" width="313" height="704" class="c c4" />
		<rect x="1337" y="85" width="313" height="704" class="c c5" />
		<rect x="1649" y="85" width="313" height="704" class="c c6" />

		<rect x="89" y="788" width="313" height="704" class="c c9" />
		<rect x="401" y="788" width="313" height="704" class="c c10" />
		<rect x="713" y="788" width="313" height="704" class="c c11" />
		<rect x="1025" y="788" width="313" height="704" class="c c12" />
		<rect x="1337" y="788" width="313" height="704" class="c c13" />
		<rect x="1649" y="788" width="313" height="704" class="c c14" />
	</g>
	<text x="1961" y="1690" text-anchor="end" font-size="150">XIWAL</text>
</svg>