web_editor/static/shapes/Floats/02.svg

138 lines
12 KiB
XML
Raw Permalink Normal View History

2024-05-03 12:47:49 +03:00
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1440 450">
<defs>
<g id="gradients">
<linearGradient id="gradient_1" x1="306.5" y1="110.8" x2="100.54" y2="417.02" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#3AADAA" style="stop-opacity:0"/>
<stop offset="1" stop-color="#3AADAA"/>
</linearGradient>
<linearGradient id="gradient_2" x1="39.43" y1="19" x2="118.98" y2="107.27" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#383E45" style="stop-opacity:0"/>
<stop offset="1" stop-color="#383E45"/>
</linearGradient>
<linearGradient id="gradient_2-2" x1="49.76" y1="9.69" x2="129.31" y2="97.96" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-3" x1="60.09" y1="0.39" x2="139.64" y2="88.65" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-4" x1="30.12" y1="27.39" x2="109.67" y2="115.66" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-5" x1="40.45" y1="18.08" x2="120" y2="106.35" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-6" x1="50.78" y1="8.77" x2="130.33" y2="97.04" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-7" x1="20.81" y1="35.78" x2="100.37" y2="124.05" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-8" x1="31.14" y1="26.47" x2="110.69" y2="114.74" xlink:href="#gradient_2"/>
<linearGradient id="gradient_2-9" x1="41.47" y1="17.16" x2="121.02" y2="105.43" xlink:href="#gradient_2"/>
<linearGradient id="gradient_3" x1="1208.09" y1="-11.9" x2="1440.2" y2="267.4" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#7C6576"/>
<stop offset="1" stop-color="#7C6576" style="stop-opacity:0"/>
</linearGradient>
</g>
</defs>
<polygon id="shape_1" points="1314.26 29.42 1349.55 80.57 1400.7 115.86 1349.55 151.15 1314.26 202.3 1278.97 151.15 1227.82 115.86 1278.97 80.57 1314.26 29.42" fill="url(#gradient_3)">
<animate attributeName="points" dur="45s" repeatCount="indefinite"
values="
1314.26 29.42 1349.55 80.57 1400.7 115.86 1349.55 151.15 1314.26 202.3 1278.97 151.15 1227.82 115.86 1278.97 80.57 1314.26 29.42;
1293.88 103.21 1372.04 104.76 1373.58 182.91 1372.04 261.07 1293.88 262.62 1215.72 261.07 1214.18 182.91 1215.72 104.76 1293.88 103.21;
1238.95 152.19 1306.99 177.84 1332.64 245.88 1306.99 313.93 1238.95 339.57 1170.91 313.93 1145.26 245.88 1170.91 177.84 1238.95 152.19;
1231.12 48.94 1302.76 80.23 1274.34 153.05 1243.05 224.69 1170.23 196.26 1098.59 164.98 1127.02 92.16 1158.3 20.51 1231.12 48.94;
1314.26 29.42 1349.55 80.57 1400.7 115.86 1349.55 151.15 1314.26 202.3 1278.97 151.15 1227.82 115.86 1278.97 80.57 1314.26 29.42"
calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95"/>
</polygon>
<path id="shape_2" d="M262.66 299.63c.66 31.1-22.32 61.4-54.7 85.85C175.74 410 134.35 428.59 107.1 415.87C79.85 403.15 66.59 359 71.82 326.48c5.14-32.79 28.63-54.1 55.14-72.32c26.75-18.31 56.37-33.59 83.53-25.49C237.56 236.94 262 268.53 262.66 299.63Z" fill="url(#gradient_1)">
<animate attributeName="d" dur="30s" repeatCount="indefinite"
values="
M262.66 299.63c.66 31.1-22.32 61.4-54.7 85.85C175.74 410 134.35 428.59 107.1 415.87C79.85 403.15 66.59 359 71.82 326.48c5.14-32.79 28.63-54.1 55.14-72.32c26.75-18.31 56.37-33.59 83.53-25.49C237.56 236.94 262 268.53 262.66 299.63Z;
M238.16 203.32c18.77 25.63 7 75.79-17.68 107.91c-24.68 32.12-62.25 46.19-92 41.5c-29.59-4.51-51.6-27.61-67.12-54.49c-15.52-26.71-24.54-57.38-13.71-78.5c11-21.11 42-32.84 82.28-38.07C170 176.44 219.22 177.52 238.16 203.32Z;
M294.9 176.2c19.88 37.27 33.59 75 20.55 95.26c-13.04 20.26-52.64 22.73-93.42 23.4c-40.78.67-82.73-.5-93.92-19.72c-11.37-19.22 8.18-56.32 29.08-94.26c21.05-37.77 43.62-76.21 67.68-77.21C249.1 102.67 275 139.1 294.9 176.2Z;
M262.66 299.63c.66 31.1-22.32 61.4-54.7 85.85C175.74 410 134.35 428.59 107.1 415.87C79.85 403.15 66.59 359 71.82 326.48c5.14-32.79 28.63-54.1 55.14-72.32c26.75-18.31 56.37-33.59 83.53-25.49C237.56 236.94 262 268.53 262.66 299.63Z"
calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95;.445 .05 .55 .95"/>
</path>
<line id="line_1" x1="335.3" y1="106.6" x2="208.7" y2="233.2" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s" values="0 0;10 -10;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</line>
<line id="line_2" x1="335.3" y1="121.31" x2="208.7" y2="247.91" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s" begin="1s" values="0 0;10 -10;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</line>
<line id="line_3" x1="335.3" y1="136.02" x2="208.7" y2="262.62" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s" begin="2s" values="0 0;10 -10;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</line>
<line id="line_4" x1="335.3" y1="150.73" x2="208.7" y2="277.33" fill="none" stroke="#F6F6F6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="5">
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="10s" begin="3s" values="0 0;10 -10;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
</line>
<g id="circles" style="transform-box: fill-box;">
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="15s" values="0;15;0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="15s" values="0 0;5 15;0 0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95" additive="sum"/>
<circle cx="73.33" cy="56.62" r="4.36" fill="url(#gradient_2)"/>
<circle cx="92.05" cy="56.62" r="4.36" fill="url(#gradient_2-2)"/>
<circle cx="110.77" cy="56.62" r="4.36" fill="url(#gradient_2-3)"/>
<circle cx="73.33" cy="75.34" r="4.36" fill="url(#gradient_2-4)"/>
<circle cx="92.05" cy="75.34" r="4.36" fill="url(#gradient_2-5)"/>
<circle cx="110.77" cy="75.34" r="4.36" fill="url(#gradient_2-6)"/>
<circle cx="73.33" cy="94.05" r="4.36" fill="url(#gradient_2-7)"/>
<circle cx="92.05" cy="94.05" r="4.36" fill="url(#gradient_2-8)"/>
<circle cx="110.77" cy="94.05" r="4.36" fill="url(#gradient_2-9)"/>
</g>
<g id="squares" style="transform-box: fill-box;" transform-origin="right bottom">
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="15s" values="0;-2;0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95"/>
<animateTransform attributeName="transform" attributeType="XML" type="translate" dur="15s" values="0;-20;0" repeatCount="indefinite" calcMode="spline" keySplines=".445 .05 .55 .95;.445 .05 .55 .95" additive="sum"/>
<rect id="square_1" x="1242.56" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_2" x="1266.49" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.1s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_3" x="1290.41" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.2s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_4" x="1314.33" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.3s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_5" x="1338.26" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.4s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_6" x="1362.18" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.5s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_7" x="1386.1" y="352.31" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.6s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_8" x="1242.56" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.7s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_9" x="1266.49" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.8s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_10" x="1290.41" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="0.9s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_11" x="1314.33" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_12" x="1338.26" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.1s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_13" x="1362.18" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.2s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_14" x="1386.1" y="375.01" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.3s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_15" x="1242.56" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.4s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_16" x="1266.49" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.5s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_17" x="1290.41" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.6s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_18" x="1314.33" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.7s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_19" x="1338.26" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.8s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_20" x="1362.18" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="1.9s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
<rect id="square_21" x="1386.1" y="397.7" width="7" height="7" fill="#383E45">
<animate attributeName="opacity" dur="5s" begin="2s" repeatCount="indefinite" values="1;0;1;1;1"/>
</rect>
</g>
</svg>