imgs/font_02/syn/02_02.svg

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="50px" height="50px" viewBox="0 0 24 24">
<style type="text/css">
.pen {
	stroke-dashoffset: 0;
	animation-duration: 10s;
	animation-iteration-count: 1000;
	animation-timing-function: ease;
}
.path00 {
		stroke-dasharray: 10;
		animation-name: dash00 
}
@keyframes dash00 {
	0.0% {
		stroke-dashoffset: 10;
	}
	8.133497528416754% {
		stroke-dashoffset: 0;
	}
}
.path01 {
		stroke-dasharray: 6;
		animation-name: dash01 
}
@keyframes dash01 {
	0%, 8.133497528416754% {
		stroke-dashoffset: 6;
	}
	13.442942514902853% {
		stroke-dashoffset: 0;
	}
}
.path02 {
		stroke-dasharray: 8;
		animation-name: dash02 
}
@keyframes dash02 {
	0%, 13.442942514902853% {
		stroke-dashoffset: 8;
	}
	20.711079510896276% {
		stroke-dashoffset: 0;
	}
}
.path03 {
		stroke-dasharray: 7;
		animation-name: dash03 
}
@keyframes dash03 {
	0%, 20.711079510896276% {
		stroke-dashoffset: 7;
	}
	27.042109429982567% {
		stroke-dashoffset: 0;
	}
}
.path04 {
		stroke-dasharray: 10;
		animation-name: dash04 
}
@keyframes dash04 {
	0%, 27.042109429982567% {
		stroke-dashoffset: 10;
	}
	35.65502114629895% {
		stroke-dashoffset: 0;
	}
}
.path05 {
		stroke-dasharray: 8;
		animation-name: dash05 
}
@keyframes dash05 {
	0%, 35.65502114629895% {
		stroke-dashoffset: 8;
	}
	42.34381805062025% {
		stroke-dashoffset: 0;
	}
}
.path06 {
		stroke-dasharray: 8;
		animation-name: dash06 
}
@keyframes dash06 {
	0%, 42.34381805062025% {
		stroke-dashoffset: 8;
	}
	48.94523733977891% {
		stroke-dashoffset: 0;
	}
}
.path07 {
		stroke-dasharray: 6;
		animation-name: dash07 
}
@keyframes dash07 {
	0%, 48.94523733977891% {
		stroke-dashoffset: 6;
	}
	54.54824670641429% {
		stroke-dashoffset: 0;
	}
}
.path08 {
		stroke-dasharray: 9;
		animation-name: dash08 
}
@keyframes dash08 {
	0%, 54.54824670641429% {
		stroke-dashoffset: 9;
	}
	62.16269235537205% {
		stroke-dashoffset: 0;
	}
}
.path09 {
		stroke-dasharray: 25;
		animation-name: dash09 
}
@keyframes dash09 {
	0%, 62.16269235537205% {
		stroke-dashoffset: 25;
	}
	83.07360287692273% {
		stroke-dashoffset: 0;
	}
}
.path10 {
		stroke-dasharray: 20;
		animation-name: dash10 
}
@keyframes dash10 {
	0%, 83.07360287692273% {
		stroke-dashoffset: 20;
	}
	100.0% {
		stroke-dashoffset: 0;
	}
}
</style>
<path class="pen path00" d="M 12.196881294250488 6.208840370178223 C 15.787473678588867 6.033920288085938 17.052173137664795 7.509482145309448 16.883464336395264 7.474055528640747 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path01" d="M 16.883464336395264 7.474055528640747 L 16.940217018127441 10.759466886520386 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path02" d="M 16.940217018127441 10.759466886520386 C 13.736414909362793 10.570634365081787 15.380181312561035 9.182636260986328 12.903638362884521 9.222405195236206 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path03" d="M 12.903638362884521 9.222405195236206 C 11.001658201217651 9.662954092025757 10.979980945587158 11.594674587249756 10.807826042175293 12.205232620239258 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path04" d="M 10.807826042175293 12.205232620239258 C 10.674515962600708 13.683454513549805 10.645701169967651 15.824795722961426 10.925082206726074 17.521905899047852 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path05" d="M 10.925082206726074 17.521905899047852 C 11.259830474853516 19.238744258880615 11.948320627212524 19.937796592712402 13.766823291778564 19.771455287933350 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path06" d="M 13.766823291778564 19.771455287933350 C 15.786266326904297 19.381595134735107 14.362778663635254 18.522235393524170 17.360062122344971 18.079331874847412 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path07" d="M 17.360062122344971 18.079331874847412 L 17.069149017333984 21.534689426422119 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path08" d="M 17.069149017333984 21.534689426422119 C 16.474528312683105 22.345554828643799 14.824215888977051 23.020274162292480 12.745977401733398 23.040209770202637 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path09" d="M 12.745977401733398 23.040209770202637 C 8.757071256637573 23.046409606933594 5.975719571113586 20.175647735595703 6.353610277175903 13.712192058563232 " fill="none" stroke="black" stroke-width="0.3"></path>
<path class="pen path10" d="M 6.353610277175903 13.712192058563232 C 6.398473978042603 10.113104581832886 8.216166257858276 6.654711484909058 12.196881294250488 6.208840370178223 " fill="none" stroke="black" stroke-width="0.3"></path>
</svg>