1<svg id="mainSVG" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600">
2 <defs>
3
4 <filter id="drop" x="-100%" y="-100%" width="250%" height="250%">
5 <feGaussianBlur stdDeviation="5" result="coloredBlur" />
6 <feOffset dx="0" dy="60" result="offsetblur"></feOffset>
7 <feFlood id="glowAlpha" flood-color="#555" flood-opacity="0.12"></feFlood>
8 <feComposite in2="offsetblur" operator="in"></feComposite>
9 <feMerge>
10 <feMergeNode />
11 <feMergeNode in="SourceGraphic"></feMergeNode>
12 </feMerge>
13 </filter>
14
15 <filter id="drop2" x="-100%" y="-100%" width="250%" height="250%">
16 <feGaussianBlur stdDeviation="6" result="coloredBlur" />
17 <feOffset dx="0" dy="6" result="offsetblur"></feOffset>
18 <feFlood id="glowAlpha" flood-color="#555" flood-opacity="0.51"></feFlood>
19 <feComposite in2="offsetblur" operator="in"></feComposite>
20 <feMerge>
21 <feMergeNode />
22 <feMergeNode in="SourceGraphic"></feMergeNode>
23 </feMerge>
24 </filter>
25
26 <filter id="goo">
27 <feGaussianBlur in="SourceGraphic" stdDeviation="7" result="blur" />
28 <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 21 -9" result="cm" />
29 <feBlend />
30 </filter>
31 <linearGradient id="grad1" gradientUnits="userSpaceOnUse" x1="400" y1="100" x2="400" y2="600">
32 <stop offset="0" style="stop-color:#059FF6" />
33 <stop offset="1" style="stop-color:#0369F3" />
34 </linearGradient>
35 <path id="copyright-cg" d="" />
36 <linearGradient id="grad2" gradientUnits="userSpaceOnUse" x1="400" y1="200" x2="400" y2="400">
37 <stop offset="0" style="stop-color:#059FF6" />
38 <stop offset="1" style="stop-color:#0408A7" />
39 </linearGradient>
40 <linearGradient id="grad3" gradientUnits="userSpaceOnUse" x1="400" y1="500" x2="400" y2="600">
41 <stop offset="0" style="stop-color:#059FF6" />
42 <stop offset="1" style="stop-color:#0369F3" />
43 </linearGradient>
44
45 <linearGradient id="grad4" gradientUnits="userSpaceOnUse" x1="400" y1="200" x2="400" y2="300">
46 <stop offset="0" style="stop-color:#02DBFE" />
47 <stop offset="1" style="stop-color:#0369F3" />
48 </linearGradient>
49
50 <linearGradient id="grad5" gradientUnits="userSpaceOnUse" x1="400" y1="100" x2="400" y2="600">
51 <stop offset="0" style="stop-color:#0369F3" />
52 <stop offset="1" style="stop-color:#02DBFE" />
53 </linearGradient>
54
55 <clipPath id="mainMask">
56 <circle cx="400" cy="300" r="100" />
57 </clipPath>
58
59 <clipPath id="otherMask">
60 <rect x="300" y="0" width="200" height="400" rx="100" ry="100" />
61 </clipPath>
62 </defs>
63
64 <g filter="url(#drop)">
65
66 <g id="whole" clip-path="url(#mainMask)">
67 <g class="dots1" filter="url(#goo)" fill="url(#grad1)">
68 <circle class="outline" cx="400" cy="300" r="90" fill="none" stroke="#0369F3" stroke-width="23" stroke-dasharray="160 65" />
69 <circle class="dot" cx="0" cy="0" r="20" />
70 <circle class="dot" cx="0" cy="0" r="20" />
71 <circle class="dot" cx="0" cy="0" r="20" />
72 <circle class="dot" cx="0" cy="0" r="20" />
73 <circle class="dot" cx="0" cy="0" r="20" />
74 <circle class="dot" cx="0" cy="0" r="20" />
75 <circle class="dot" cx="0" cy="0" r="20" />
76 <circle class="dot" cx="0" cy="0" r="20" />
77 <circle class="dot" cx="0" cy="0" r="20" />
78
79 </g>
80
81 <g class="dots2" filter="url(#goo)" fill="url(#grad2)">
82 <circle class="outline" cx="400" cy="300" r="90" fill="none" stroke="#0408A7" stroke-width="23" stroke-dasharray="160 40" />
83 <circle class="dot" cx="0" cy="0" r="20" />
84 <circle class="dot" cx="0" cy="0" r="20" />
85 <circle class="dot" cx="0" cy="0" r="20" />
86 <circle class="dot" cx="0" cy="0" r="20" />
87 <circle class="dot" cx="0" cy="0" r="20" />
88 <circle class="dot" cx="0" cy="0" r="20" />
89 <circle class="dot" cx="0" cy="0" r="20" />
90 <circle class="dot" cx="0" cy="0" r="20" />
91 <circle class="dot" cx="0" cy="0" r="20" />
92
93 </g>
94
95 <g class="dots3" filter="url(#goo)" fill="url(#grad3)">
96 <circle class="outline" cx="400" cy="300" r="90" fill="none" stroke="url(#grad3)" stroke-width="23" stroke-dasharray="240 " />
97 <circle class="dot" cx="0" cy="0" r="20" />
98 <circle class="dot" cx="0" cy="0" r="20" />
99 <circle class="dot" cx="0" cy="0" r="20" />
100 <circle class="dot" cx="0" cy="0" r="20" />
101 <circle class="dot" cx="0" cy="0" r="20" />
102 <circle class="dot" cx="0" cy="0" r="20" />
103 <circle class="dot" cx="0" cy="0" r="20" />
104 <circle class="dot" cx="0" cy="0" r="20" />
105 <circle class="dot" cx="0" cy="0" r="20" />
106 </g>
107
108 <g class="dots4" filter="url(#goo)" fill="url(#grad4)">
109 <circle class="dot" cx="0" cy="0" r="20" />
110 <circle class="dot" cx="0" cy="0" r="20" />
111 <circle class="dot" cx="0" cy="0" r="20" />
112 <circle class="dot" cx="0" cy="0" r="20" />
113 <circle class="dot" cx="0" cy="0" r="20" />
114 <circle class="dot" cx="0" cy="0" r="20" />
115 <circle class="dot" cx="0" cy="0" r="20" />
116 <circle class="dot" cx="0" cy="0" r="20" />
117 <circle class="dot" cx="0" cy="0" r="20" />
118 </g>
119
120 </g>
121
122 </g>
123 <g filter="url(#drop2)">
124 <g clip-path="url(#otherMask)">
125 <g class="dots5" fill="url(#grad2)" filter="url(#goo)">
126 <circle class="outsideDot" cx="0" cy="0" r="20" />
127 <circle class="outsideDot" cx="0" cy="0" r="20" />
128 <circle class="outsideDot" cx="0" cy="0" r="20" />
129 <circle class="outsideDot" cx="0" cy="0" r="20" />
130 <circle class="outsideDot" cx="0" cy="0" r="20" />
131 <circle class="outsideDot" cx="0" cy="0" r="20" />
132 <circle class="outsideDot" cx="0" cy="0" r="20" />
133 <circle class="outsideDot" cx="0" cy="0" r="20" />
134 <circle class="outsideDot" cx="0" cy="0" r="20" />
135 </g>
136 </g>
137
138 </g>
139</svg>