If you're having trouble working with the SVG, you don't want to spend all your useful time on the description of each point of the figure - put yourself on Adobe Illustrator's computer (or those with a vector schedule) and that will make it easier for you to draw your vector figure.I've been writing a website for a month and designing it myself. I'm using Adobe programmes for comfort.Your best work done in Adobe Illustrator. Here are the formats in which the file can be kept: UPDATING: 24.11.17<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Слой_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 1366 768" style="enable-background:new 0 0 1366 768;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFEC3E;}
.st1{fill:#4614C1;}
.st2{fill:#FFFFFF;}
.st3{font-family:'Arial-Black';}
.st4{font-size:39.5469px;}
.st5{font-size:31px;}
</style>
<path class="st0" d="M0,153c0,0,208-120,437-107s683,147,810,114s119-44,119-44v524c0,0-197,88-358,69s-603.4-204.9-853-81
C16,697,0,706,0,706V153z"/>
<path class="st1" d="M0,213.4C0,213.4,206,68,404,68c183,0,646,152,790,117s172.1-44.3,172.1-44.3v458.5c0,0-182.1,126.8-473.1,44.8
s-501-86-557-81S62,613,0,665.4C-0.3,665.7,0,213.4,0,213.4z"/>
<text transform="matrix(1 0 0 1 381.8267 341.6289)"><tspan x="0" y="0" class="st2 st3 st4">EXAMPLE OF SVG BLOG</tspan><tspan x="63.6" y="37.2" class="st2 st3 st5">BY ANTON ROGALSKIY</tspan></text>
</svg>Adobe Illustrator:Plus:Usable interfacePossibility of the rapid creation of vectors/diagrams for multi-plan applications (from the establishment of a common lane for separation on site to logo and vector drawings)You're fast.It is possible to maintain different formats.In addition to keeping in a certain format (SVG tolerance), it is possible to specify in the options how exactly you want to keep and what to add in your drawing.We can watch the code SVG! The SVG files of the other authors of the works can be opened and the objects removed/amended. When I was working on what I needed a map of Europe, downloading pictures of the format .svg from Wikipedia, I removed unnecessary watermarks, a couple of countries in Europe and Asia, painted them with other colors, and the picture I needed.If there is a pdf file, it can be opened and the pieces in the file can be taken into detail (as well as separate figures). P.S. This does not work if pdf is a scan or retained as a single figure.Less:Price. Adobe programmes are sold by subscription to the product. These prices are not many.As in every case, everything needs to be learned before applying. It's gonna take a few dozen skates to figure out how the program works, but if you start working straight on the program, know what you're doing and what you want to do, you can easily paint what you've been thinking. The SVG code may be uncomfortable for editing/supply on page and for adding other objects inside. But I think by using a laugh, this problem will be easy to solve.A little personal experience. When I first got the program in hand, I figured out what's going on, because I had experience in Adobe Photoshop and Paint before.(If there are proposals for adding pros/minus - don't be embarrassed to edit)SVG storage unit: As we can see, the file can be built on its taste and color. The SVG code you can see/scope while you're still on the SVG Code...Another example of SVG: <?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Слой_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 1366 768" style="enable-background:new 0 0 1366 768;" xml:space="preserve">
<style type="text/css">
.st0{fill:url(#SVGID_1_);}
.st1{fill:none;}
.st2{font-family:'Monaco';}
.st3{font-size:18px;}
.st4{fill:url(#SVGID_2_);}
</style>
<g>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="162.809" y1="99.4912" x2="959.6008" y2="535.2817">
<stop offset="0" style="stop-color:#94FF9B"/>
<stop offset="0.9988" style="stop-color:#00942A"/>
</linearGradient>
<rect x="0.5" y="0.5" class="st0" width="1365" height="767"/>
<path d="M1365,1v766H1V1H1365 M1366,0H0v768h1366V0L1366,0z"/>
</g>
<rect x="96.6" y="44.4" class="st1" width="462.8" height="223.6"/>
<text transform="matrix(1 0 0 1 106.5498 58.6099)"><tspan x="0" y="0" class="st2 st3"> УAловите свое руки мощные вдохновениев</tspan><tspan x="432.1" y="0" class="st2 st3">-</tspan><tspan x="0" y="21.6" class="st2 st3">кладывает в ваши творческие инструменты, </tspan><tspan x="5.4" y="43.2" class="st2 st3">которые обеспечивают абсолютный контроль </tspan><tspan x="-5.4" y="64.8" class="st2 st3">над текстом. их помощью вы любым элементам </tspan><tspan x="-5.4" y="86.4" class="st2 st3">тени, эффекты с использованием прозрачно</tspan><tspan x="437.5" y="86.4" class="st2 st3">-</tspan><tspan x="-5.4" y="108" class="st2 st3">сти. Они позволят вам создавать элегантные </tspan><tspan x="-5.4" y="129.6" class="st2 st3">таблицы. И не бойтесь экспериментировать у </tspan><tspan x="5.4" y="151.2" class="st2 st3">вас всегда ть отменить или выполнить по</tspan><tspan x="426.7" y="151.2" class="st2 st3">-</tspan><tspan x="135" y="172.8" class="st2 st3">вторно действия.</tspan><tspan x="10.8" y="194.4" class="st2 st3">Любая работа в продуктивность работы на </tspan></text>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="702.8804" y1="625.736" x2="672.6509" y2="381.0211">
<stop offset="0" style="stop-color:#94FF9B"/>
<stop offset="0.9988" style="stop-color:#00942A"/>
</linearGradient>
<path class="st4" d="M0,768c0,0,91-305,356-352s536,81,749-62s261-192.4,261-192.4V268c0,0-185.8,110-269,134
c-90,26-268,100-384,107c-94.1,5.7-245,2-385,46S28,730,0,768z"/>
<rect x="910.7" y="521.9" class="st1" width="358.4" height="181.4"/>
<text transform="matrix(1 0 0 1 911.7344 536.0391)"><tspan x="0" y="0" class="st2 st3"> УAловите свое руки мощные вдох</tspan><tspan x="345.7" y="0" class="st2 st3">-</tspan><tspan x="0" y="21.6" class="st2 st3">новениевкладывает в ваши творче</tspan><tspan x="345.7" y="21.6" class="st2 st3">-</tspan><tspan x="0" y="43.2" class="st2 st3">ские инструменты, которые обеспе</tspan><tspan x="345.7" y="43.2" class="st2 st3">-</tspan><tspan x="16.2" y="64.8" class="st2 st3">чивают абсолютный контроль над </tspan><tspan x="0" y="86.4" class="st2 st3">текстом. их помощью вы любым эле</tspan><tspan x="345.7" y="86.4" class="st2 st3">-</tspan><tspan x="0" y="108" class="st2 st3">ментам тени, эффекты с использо</tspan><tspan x="345.7" y="108" class="st2 st3">-</tspan><tspan x="0" y="129.6" class="st2 st3">ванием прозрачности. Они позволят </tspan><tspan x="0" y="151.2" class="st2 st3">вам создавать элегантные таблицы. </tspan></text>
</svg>