How do you create simple SVG wavy lines?

[simona6]

We are trying to recreate SVG images using a theme we have used elsewhere, but in a different theme.  We are able to copy the SVG code and place it into WP Bakery and it works, to a point.

Example: https://www.portotheme.com/wordpress/porto/cleaning-services/

If you scroll down this page, you will see a deep blue row titled "For Residential and Commercial Cleaning".

The top and bottom curves are SVG.

When I copy that code and use it elsewhere, I get a top curve with a black stroke edge to it.  No idea what is telling it to be black.
The bottom curve doesn't work for me.

I have asked them how they created the curve, but is there an online tool that can do this, so you move the pointers around to get your shape, add the any 'edging' you want and then copy the SVG code?

Thanks.

[requinix]

Can't diagnose a black stroke if we can't see it. The SVG on that page you cited only uses #F7F7F7 to match the page's white background color.

[theglobe]

Just add this css code:

@media (min-width: 992px) 

.intro-title strong:after {

background-color: !transparent

} 

[Barand]

If you want a wavy line, just generate a sine wave.