如何使用相同的颜色围绕每个svg路径创建一个光晕?

时间:2017-05-27 15:30:55

标签: javascript css svg

请有人告诉我如何为每个svg路径添加辉光吗? 我的目标是将这个svg图像转换为霓虹灯。 万分感谢。

<svg version="1.0" xmlns="http://www.w3.org/2000/svg"  width="60%" height="534.000000px" viewBox="0 0 572.000000 534.000000"  preserveAspectRatio="xMidYMid meet">

		<g transform="translate(0.000000,534.000000) scale(0.100000,-0.100000)" fill="#000000" stroke="none">
			<path class="big-blue" fill="#21265A" d="M4935 5329 c-243 -36 -492 -190 -675 -420 -93 -116 -146 -205 -211 -349 -64 -144 -218 -600 -267 -795 -69 -271 -130 -614 -152 -860 -13 -139 -13 -352 -1 -339 5 5 30 92 56 194 182 723 341 1159 552 1518 133 226 278 396 399 467 180 105 401 92 537 -34 146 -135 141 -421 -14 -746 -193 -407 -691 -941 -1265 -1357 -224 -163 -230 -173 -66 -112 374 140 854 483 1262 900 232 238 378 425 478 614 313 591 118 1221 -408 1316 -84 15 -137 16 -225 3z"/>
			<path class="big-red" fill="#DE171C" d="M2580 4470 c-85 -18 -188 -78 -264 -154 -120 -119 -166 -234 -167 -411 0 -258 133 -531 399 -821 171 -187 358 -332 552 -429 148 -74 290 -116 290 -86 0 5 -46 40 -102 77 -246 164 -510 408 -622 577 -69 104 -126 225 -162 342 -23 75 -27 110 -28 210 -1 112 1 124 27 177 55 112 156 166 288 155 174 -15 314 -152 436 -429 94 -212 143 -395 208 -768 20 -112 39 -208 44 -213 21 -21 28 298 11 493 -35 398 -114 708 -232 908 -45 78 -217 248 -298 295 -118 68 -272 99 -380 77z"/>
			<path class="small-blue" fill="#383D60" d="M4119 3470 c-50 -26 -101 -88 -143 -174 -47 -94 -68 -156 -122 -361 -26 -93 -48 -178 -51 -187 -9 -32 14 -20 134 70 332 248 422 354 423 500 0 75 -26 134 -70 157 -41 21 -127 18 -171 -5z"/>
			<path class="small-red" fill="#E5322D" d="M2986 3225 c-21 -23 -26 -38 -26 -80 0 -69 20 -124 75 -200 51 -72 124 -138 210 -190 75 -45 89 -45 80 -2 -53 253 -105 404 -160 457 -30 29 -43 34 -94 38 -55 4 -62 2 -85 -23z"/>
			<path class="big-green" fill="#006929" d="M4495 2669 c-153 -20 -442 -113 -498 -160 -29 -24 -24 -24 169 6 295 48 537 44 752 -11 293 -74 444 -255 365 -435 -64 -145 -214 -205 -414 -165 -154 31 -313 104 -580 266 -72 44 -136 80 -141 80 -17 0 10 -35 79 -101 198 -189 503 -370 717 -424 185 -47 373 -28 494 49 211 135 250 401 87 597 -109 129 -304 234 -530 285 -85 18 -399 27 -500 13z"/>
			<path class="small-green" fill="#019541" d="M4045 2443 c-44 -8 -84 -18 -88 -22 -18 -17 248 -165 352 -195 67 -20 111 -20 156 -2 103 44 48 173 -93 216 -77 24 -206 25 -327 3z"/>
			<path class="arrow" fill="#151515" d="M2230 2790 c0 -18 124 -142 205 -205 172 -135 458 -302 501 -293 10 2 -16 24 -70 58 -258 164 -387 254 -436 304 -30 31 -52 56 -48 56 29 0 305 -118 483 -207 382 -190 666 -390 918 -645 l137 -139 68 3 67 3 -140 140 c-147 148 -239 225 -420 354 -365 258 -798 471 -1134 556 -109 27 -131 30 -131 15z"/>
			<path class="v" fill="#081D0C" d="M520 2051 c0 -28 1 -28 75 -34 132 -10 184 -58 239 -218 16 -46 78 -223 138 -394 61 -170 147 -420 193 -555 111 -326 109 -320 144 -320 24 0 31 6 41 33 17 46 195 556 302 861 163 468 213 546 377 587 59 15 66 19 69 43 l3 26 -340 0 -341 0 0 -29 c0 -28 1 -28 68 -35 97 -10 165 -45 191 -100 23 -46 26 -105 10 -176 -12 -54 -276 -835 -293 -869 -12 -22 -14 -20 -30 40 -10 35 -90 270 -177 523 -87 252 -159 470 -159 485 0 62 43 83 193 96 77 7 77 7 77 36 l0 29 -390 0 -390 0 0 -29z"/>
			<path class="i-dot" fill="#081D0C" d="M3132 2053 c-17 -6 -42 -57 -42 -83 0 -33 53 -80 89 -80 41 0 80 36 88 82 8 50 -29 88 -84 87 -21 0 -44 -3 -51 -6z"/>
			<path  class="t" fill="#081D0C" d="M2667 1894 c-11 -110 -72 -196 -159 -224 -30 -9 -38 -17 -38 -36 0 -23 3 -24 64 -24 l64 0 4 -252 c3 -233 5 -257 25 -300 26 -56 55 -77 119 -84 72 -9 126 9 167 55 41 46 57 93 57 174 0 49 -3 57 -19 57 -16 0 -20 -11 -26 -67 -8 -79 -16 -100 -44 -130 -26 -27 -61 -38 -97 -29 -48 12 -54 50 -54 326 l0 250 100 0 100 0 0 30 0 30 -100 0 -100 0 0 140 0 140 -29 0 c-27 0 -28 -2 -34 -56z"/>
			<path class="la" fill="#081D0C" d="M305 1883 c-4 -10 -40 -110 -80 -223 -40 -113 -81 -227 -92 -254 -11 -32 -37 -68 -71 -102 -43 -42 -53 -57 -50 -80 l3 -27 31 26 32 27 -24 -75 c-28 -87 -30 -113 -10 -121 23 -9 95 29 166 86 l65 52 5 -40 c16 -110 103 -135 188 -53 l40 39 -10 -34 c-22 -83 24 -73 175 36 65 47 97 85 97 116 0 14 -32 -5 -106 -62 -47 -36 -88 -63 -91 -60 -3 3 18 54 46 115 55 118 60 141 34 141 -27 0 -34 -8 -110 -116 -106 -150 -174 -198 -203 -145 -28 53 -4 135 59 204 70 75 187 110 284 82 24 -7 27 -5 27 19 0 31 -27 41 -116 41 -110 0 -195 -56 -317 -209 -35 -43 -161 -139 -165 -126 -5 15 83 266 154 443 95 232 112 317 64 317 -10 0 -21 -8 -25 -17z"/>
			<path class="o" fill="#081D0C" d="M2022 1681 c-70 -24 -143 -96 -185 -181 -30 -60 -32 -72 -32 -165 0 -91 3 -106 31 -166 63 -133 154 -199 273 -199 83 0 136 24 195 85 87 89 128 219 107 337 -38 216 -218 350 -389 289z m170 -58 c52 -49 71 -114 76 -258 7 -229 -47 -357 -151 -357 -113 0 -170 110 -170 327 -1 130 20 215 65 269 49 60 127 68 180 19z"/>
			<path class="e" fill="#081D0C" d="M4344 1689 c-51 -15 -126 -70 -166 -124 -131 -172 -88 -452 86 -560 41 -25 62 -30 124 -34 90 -4 140 9 188 51 67 59 112 188 65 188 -13 0 -22 -12 -31 -47 -48 -168 -254 -201 -330 -53 -20 40 -40 134 -40 192 l0 38 216 0 217 0 -6 53 c-9 90 -44 165 -106 228 -72 73 -133 93 -217 68z m128 -69 c31 -34 48 -86 48 -150 0 -56 -8 -68 -51 -80 -45 -13 -216 -13 -224 0 -9 15 13 147 30 181 46 87 140 111 197 49z"/>
			<path class="i" fill="#081D0C" d="M3010 1651 c0 -20 19 -31 55 -31 12 0 33 -9 46 -19 l24 -19 -3 -259 c-2 -158 -8 -263 -14 -270 -6 -7 -33 -13 -60 -13 -46 0 -49 -2 -46 -22 3 -23 6 -23 153 -26 176 -3 218 2 213 26 -2 12 -15 18 -48 20 -27 2 -50 9 -57 19 -10 13 -13 92 -13 315 l0 298 -125 0 c-116 0 -125 -1 -125 -19z"/>
			<path class="v" fill="#081D0C" d="M3344 1655 c-9 -23 5 -35 41 -35 76 0 106 -51 219 -370 91 -258 106 -291 129 -288 18 3 36 42 118 259 53 140 109 279 124 308 31 56 70 91 104 91 16 0 21 6 21 25 l0 26 -142 -3 c-133 -3 -143 -4 -143 -22 0 -13 11 -23 34 -31 64 -21 74 -61 43 -162 -34 -109 -115 -304 -122 -296 -12 12 -150 404 -150 424 0 24 29 39 74 39 32 0 36 3 36 25 l0 25 -190 0 c-157 0 -192 -3 -196 -15z"/>
			<path class="solutions" fill="#373435" d="M1882 830 c-38 -23 -52 -54 -52 -114 0 -60 26 -89 110 -121 69 -26 90 -45 90 -83 0 -28 -42 -62 -77 -62 -38 0 -83 40 -83 75 0 20 -5 25 -25 25 -21 0 -25 -5 -25 -31 0 -75 54 -129 130 -129 82 0 130 51 130 137 0 63 -27 94 -110 128 -83 34 -99 51 -85 91 22 60 110 50 129 -14 6 -22 14 -31 23 -27 8 3 19 5 24 5 14 0 11 38 -7 75 -28 61 -111 82 -172 45z"/>
			<path class="solutions" fill="#373435" d="M2210 831 c-23 -12 -45 -36 -63 -72 -27 -50 -28 -61 -25 -149 2 -72 8 -105 24 -135 59 -113 199 -113 258 0 17 33 21 58 21 145 0 92 -3 110 -24 146 -26 46 -84 84 -128 84 -15 0 -44 -8 -63 -19z m120 -69 c90 -91 51 -312 -56 -312 -106 0 -147 236 -53 314 40 34 74 33 109 -2z"/>
			<path class="solutions" fill="#373435" d="M3545 836 c-42 -18 -82 -68 -96 -119 -17 -64 -7 -193 20 -245 55 -107 193 -110 253 -5 41 70 42 214 2 298 -32 68 -115 101 -179 71z m102 -70 c54 -45 70 -172 34 -253 -48 -105 -157 -77 -183 48 -32 153 60 280 149 205z"/>
			<path class="solutions" fill="#373435" d="M4184 836 c-33 -15 -64 -67 -64 -109 0 -68 38 -110 125 -137 55 -17 75 -37 75 -76 0 -87 -136 -82 -155 6 -5 24 -12 30 -32 30 -24 0 -25 -2 -20 -42 10 -77 58 -118 139 -118 61 0 105 36 118 96 19 86 -18 142 -117 175 -76 25 -96 52 -69 93 9 14 28 29 42 32 34 9 78 -24 82 -60 3 -20 8 -26 19 -22 8 3 21 6 29 6 11 0 13 7 8 28 -13 51 -35 84 -69 98 -42 17 -71 17 -111 0z"/>
			<path class="solutions" fill="#373435" d="M2480 620 l0 -220 105 0 105 0 0 30 0 30 -80 0 -80 0 0 190 0 190 -25 0 -25 0 0 -220z"/>
			<path class="solutions" fill="#373435" d="M2730 670 c0 -192 11 -240 61 -265 46 -24 112 -19 148 11 43 36 51 77 51 262 l0 162 -25 0 -25 0 -1 -152 c0 -91 -5 -167 -12 -188 -14 -39 -48 -57 -91 -46 -46 11 -56 54 -56 231 l0 155 -25 0 -25 0 0 -170z"/>
			<path class="solutions" fill="#373435" d="M3030 810 c0 -29 1 -30 50 -30 l50 0 0 -190 0 -190 30 0 30 0 0 190 0 190 50 0 c49 0 50 1 50 30 l0 30 -130 0 -130 0 0 -30z"/>
			<path class="solutions" fill="#373435" d="M3330 620 l0 -220 30 0 30 0 0 220 0 220 -30 0 -30 0 0 -220z"/>
			<path class="solutions" fill="#373435" d="M3800 620 l0 -220 25 0 25 0 1 158 1 157 76 -157 c71 -148 78 -158 104 -158 l28 0 0 220 0 220 -25 0 -25 0 -1 -157 -1 -158 -76 157 c-71 145 -79 157 -104 158 l-28 0 0 -220z"/>
		</g>
	</svg>

0 个答案:

没有答案