animation2code benchmark
For best compatibility, please view this dashboard in a Chrome browser.
← back

rendered animation

Think - create cycle

1<svg
2     width="100"
3     height="100"
4     viewBox="0 0 100 100">
5  <defs>
6    <mask id="thinkMask" width="100" height="100" style="position: absolute;">
7      <circle
8              cy="48.483498"
9              cx="21.232237"
10              r="18.812815"
11              fill="white"
12              class="thinkMaskCircle" />
13    </mask>
14    <mask id="createMask">
15      <circle
16              cx="69.173874"
17              cy="49.998726"
18              r="25"
19              fill="white"
20              class="createMaskCircle" />
21    </mask>
22  </defs>
23  <g
24     style="font-style:normal;font-weight:normal;font-size:5px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#d1dce1;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
25     id="textTHINK">
26    <path
27          d="m 3.7754183,44.826611 6.9378657,0 0,0.933837 -2.9113765,0 0,7.267457 -1.1151123,0 0,-7.267457 -2.9113769,0 0,-0.933837 z" />
28    <path
29          d="m 11.811917,44.826611 1.109619,0 0,3.361816 4.031983,0 0,-3.361816 1.109619,0 0,8.201294 -1.109619,0 0,-3.90564 -4.031983,0 0,3.90564 -1.109619,0 0,-8.201294 z" />
30    <path
31          d="m 20.27139,44.826611 1.109619,0 0,8.201294 -1.109619,0 0,-8.201294 z" />
32    <path
33          d="m 23.589261,44.826611 1.494141,0 3.636474,6.860961 0,-6.860961 1.07666,0 0,8.201294 -1.49414,0 -3.636475,-6.860962 0,6.860962 -1.07666,0 0,-8.201294 z" />
34    <path
35          d="m 32.004788,44.826611 1.10962,0 0,3.466186 3.680419,-3.466186 1.428223,0 -4.070434,3.823242 4.361572,4.378052 -1.461182,0 -3.938598,-3.949585 0,3.949585 -1.10962,0 0,-8.201294 z" />
36  </g>
37  <g
38     style="font-style:normal;font-weight:normal;font-size:5px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#0e232e;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
39     id="textTHINK-dark"
40     mask="url(#thinkMask)">
41    <path
42          d="m 3.7754183,44.826611 6.9378657,0 0,0.933837 -2.9113765,0 0,7.267457 -1.1151123,0 0,-7.267457 -2.9113769,0 0,-0.933837 z" />
43    <path
44          d="m 11.811917,44.826611 1.109619,0 0,3.361816 4.031983,0 0,-3.361816 1.109619,0 0,8.201294 -1.109619,0 0,-3.90564 -4.031983,0 0,3.90564 -1.109619,0 0,-8.201294 z" />
45    <path
46          d="m 20.27139,44.826611 1.109619,0 0,8.201294 -1.109619,0 0,-8.201294 z" />
47    <path
48          d="m 23.589261,44.826611 1.494141,0 3.636474,6.860961 0,-6.860961 1.07666,0 0,8.201294 -1.49414,0 -3.636475,-6.860962 0,6.860962 -1.07666,0 0,-8.201294 z" />
49    <path
50          d="m 32.004788,44.826611 1.10962,0 0,3.466186 3.680419,-3.466186 1.428223,0 -4.070434,3.823242 4.361572,4.378052 -1.461182,0 -3.938598,-3.949585 0,3.949585 -1.10962,0 0,-8.201294 z" />
51  </g>
52  <g
53     style="font-style:normal;font-weight:normal;font-size:40px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#d1dce1;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
54     id="textCREATE">
55    <path
56          d="m 53.430572,47.018058 -1.15412,0 q -0.09766,-0.45277 -0.412819,-0.772372 -0.315163,-0.324042 -0.754617,-0.492721 -0.439453,-0.173117 -0.909978,-0.173117 -0.754617,0 -1.35831,0.439453 -0.603693,0.435014 -0.954368,1.251775 -0.350675,0.812323 -0.350675,1.948686 0,1.136364 0.350675,1.953125 0.350675,0.812323 0.954368,1.251776 0.603693,0.435014 1.35831,0.435014 0.470525,0 0.905539,-0.168679 0.435015,-0.173118 0.750178,-0.49272 0.315163,-0.324041 0.421697,-0.776811 l 1.15412,0 q -0.150923,0.78125 -0.621449,1.336115 -0.470526,0.550426 -1.14968,0.843395 -0.679155,0.28853 -1.460405,0.28853 -1.091975,0 -1.93537,-0.563743 -0.838956,-0.563743 -1.318359,-1.611328 -0.474964,-1.047586 -0.474964,-2.494674 0,-1.43821 0.474964,-2.485795 0.479403,-1.047585 1.318359,-1.615767 0.843395,-0.568182 1.93537,-0.568182 0.776811,0 1.455966,0.292969 0.683593,0.28853 1.154119,0.843395 0.470526,0.550426 0.621449,1.331676 z" />
57    <path
58          d="m 60.357507,53.765217 -1.85103,-3.533381 -2.17951,0 0,3.533381 -1.100852,0 0,-9.090909 2.911932,0 q 1.02983,0 1.731179,0.395064 0.705788,0.395064 1.065341,1.043146 0.363991,0.648082 0.363991,1.402699 0,0.847834 -0.443892,1.500355 -0.443892,0.652521 -1.229581,0.981001 l 1.97532,3.697621 0,0.07102 -1.242898,0 z m -4.03054,-8.114347 0,3.568892 1.81108,0 q 0.763494,0 1.220703,-0.248579 0.461648,-0.24858 0.665838,-0.639205 0.208629,-0.390625 0.208629,-0.816761 0,-0.435014 -0.208629,-0.86559 -0.208629,-0.430575 -0.670277,-0.714666 -0.461648,-0.284091 -1.216264,-0.284091 l -1.81108,0 z" />
59    <path
60          d="m 68.718214,52.788654 0,0.976563 -5.557529,0 0,-9.090909 5.486506,0 0,0.976562 -4.385653,0 0,3.071733 3.924005,0 0,0.976563 -3.924005,0 0,3.089488 4.456676,0 z" />
61    <path
62          d="m 70.899943,53.765217 -1.171875,0 3.125,-9.090909 1.136364,0 3.125,9.090909 -1.171875,0 -0.803445,-2.432529 -3.426846,0 -0.812323,2.432529 z m 2.46804,-7.404119 -1.331676,3.995028 2.778764,0 -1.322798,-3.995028 -0.12429,0 z" />
63    <path
64          d="m 83.763935,44.674308 0,0.976562 -2.858665,0 0,8.114347 -1.100852,0 0,-8.114347 -2.858665,0 0,-0.976562 6.818182,0 z" />
65    <path
66          d="m 90.935011,52.788654 0,0.976563 -5.557529,0 0,-9.090909 5.486506,0 0,0.976562 -4.385653,0 0,3.071733 3.924005,0 0,0.976563 -3.924005,0 0,3.089488 4.456676,0 z" />
67  </g>
68  <g
69     style="font-style:normal;font-weight:normal;font-size:40px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#0e232e;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
70     class="textCREATE-dark"
71     mask="url(#createMask)">
72    <path
73          d="m 53.430572,47.018058 -1.15412,0 q -0.09766,-0.45277 -0.412819,-0.772372 -0.315163,-0.324042 -0.754617,-0.492721 -0.439453,-0.173117 -0.909978,-0.173117 -0.754617,0 -1.35831,0.439453 -0.603693,0.435014 -0.954368,1.251775 -0.350675,0.812323 -0.350675,1.948686 0,1.136364 0.350675,1.953125 0.350675,0.812323 0.954368,1.251776 0.603693,0.435014 1.35831,0.435014 0.470525,0 0.905539,-0.168679 0.435015,-0.173118 0.750178,-0.49272 0.315163,-0.324041 0.421697,-0.776811 l 1.15412,0 q -0.150923,0.78125 -0.621449,1.336115 -0.470526,0.550426 -1.14968,0.843395 -0.679155,0.28853 -1.460405,0.28853 -1.091975,0 -1.93537,-0.563743 -0.838956,-0.563743 -1.318359,-1.611328 -0.474964,-1.047586 -0.474964,-2.494674 0,-1.43821 0.474964,-2.485795 0.479403,-1.047585 1.318359,-1.615767 0.843395,-0.568182 1.93537,-0.568182 0.776811,0 1.455966,0.292969 0.683593,0.28853 1.154119,0.843395 0.470526,0.550426 0.621449,1.331676 z" />
74    <path
75          d="m 60.357507,53.765217 -1.85103,-3.533381 -2.17951,0 0,3.533381 -1.100852,0 0,-9.090909 2.911932,0 q 1.02983,0 1.731179,0.395064 0.705788,0.395064 1.065341,1.043146 0.363991,0.648082 0.363991,1.402699 0,0.847834 -0.443892,1.500355 -0.443892,0.652521 -1.229581,0.981001 l 1.97532,3.697621 0,0.07102 -1.242898,0 z m -4.03054,-8.114347 0,3.568892 1.81108,0 q 0.763494,0 1.220703,-0.248579 0.461648,-0.24858 0.665838,-0.639205 0.208629,-0.390625 0.208629,-0.816761 0,-0.435014 -0.208629,-0.86559 -0.208629,-0.430575 -0.670277,-0.714666 -0.461648,-0.284091 -1.216264,-0.284091 l -1.81108,0 z" />
76    <path
77          d="m 68.718214,52.788654 0,0.976563 -5.557529,0 0,-9.090909 5.486506,0 0,0.976562 -4.385653,0 0,3.071733 3.924005,0 0,0.976563 -3.924005,0 0,3.089488 4.456676,0 z" />
78    <path
79          d="m 70.899943,53.765217 -1.171875,0 3.125,-9.090909 1.136364,0 3.125,9.090909 -1.171875,0 -0.803445,-2.432529 -3.426846,0 -0.812323,2.432529 z m 2.46804,-7.404119 -1.331676,3.995028 2.778764,0 -1.322798,-3.995028 -0.12429,0 z" />
80    <path
81          d="m 83.763935,44.674308 0,0.976562 -2.858665,0 0,8.114347 -1.100852,0 0,-8.114347 -2.858665,0 0,-0.976562 6.818182,0 z" />
82    <path
83          d="m 90.935011,52.788654 0,0.976563 -5.557529,0 0,-9.090909 5.486506,0 0,0.976562 -4.385653,0 0,3.071733 3.924005,0 0,0.976563 -3.924005,0 0,3.089488 4.456676,0 z" />
84  </g>
85  <circle
86          style="opacity:1;fill:#0e232e;fill-opacity:1;stroke:none;stroke-width:0.5;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
87          class="ball-top"
88          cx="0"
89          cy="0"
90          r="2" />
91  <circle
92          style="opacity:1;fill:#0e232e;fill-opacity:1;stroke:none;stroke-width:0.5;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
93          class="ball-bottom"
94          cx="0"
95          cy="0"
96          r="2" />
97  <!--circle
98style="opacity:0.66100003;fill:#dc0000;fill-opacity:1;stroke:none;stroke-width:0.5;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
99class="clip-circle-big"
100cx="67.173874"
101cy="49.998726"
102r="25" />
103<circle
104cy="49.037697"
105cx="26.287533"
106class="clip-circle-small"
107style="opacity:0.66100003;fill:#dc0000;fill-opacity:1;stroke:none;stroke-width:0.5;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
108r="11" /-->
109  <!--path
110style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
111d="m 67.2,39.264578 c 0,0 -5.195345,-18.056477 -20.4,-18.056477 -15.204655,0 -20.4,17.930208 -20.4,17.930208"
112id="motion-path-top"
113inkscape:connector-curvature="0"
114sodipodi:nodetypes="czc" />
115<path
116sodipodi:nodetypes="czc"
117inkscape:connector-curvature="0"
118id="motion-path-bottom"
119d="m 67.2,58.979615 c 0,0 -5.195345,18.056477 -20.4,18.056477 -15.204655,0 -20.4,-17.930208 -20.4,-17.930208"
120style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /-->
121</svg>