Need a svg figure

Question

I have a figure with 100% width. And I need her inverted version. I rely on your help please.

<svg id="svg1" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100px" viewBox="0 0 100 100" preserveAspectRatio="none">
<path d="M0 0 C50 90 100 0 100 0 Z"/>
</svg>

jsfiddle example

Inverted in what way? Black becomes white and vice versa or reflected about an axis? — Robert Longson, Jan 29 '15 at 09:40
i update my jsfiddle example http://jsfiddle.net/AlexSotona/62j6sq9L/1/ — AlexSotona, Jan 29 '15 at 12:10

Robert Longson · Accepted Answer · 2015-01-29T14:23:03.197

0

Draw it in white on a black background then.

<svg id="svg1" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100px" viewBox="0 0 100 100" preserveAspectRatio="none">
    <rect width="100" height="40" fill="black"/>
<path d="M0 0 C50 90 100 0 100 0 Z" fill="white"/>
</svg>

or alternatively you could just keep drawing round the edge...

<svg id="svg1" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100px" viewBox="0 0 100 100" preserveAspectRatio="none">
    <path d="M0 0 C50 90 100 0 100 0 v40 h-100 v-40Z" fill="black"/>
</svg>

edited Jan 29 '15 at 14:23

answered Jan 29 '15 at 13:05

Robert Longson

118,664
26
252
242

The whole point is that I need a figure on a transparent background . But thanks anyway.))) – AlexSotona Jan 29 '15 at 13:40
Saying so in the question would have helped. – Robert Longson Jan 29 '15 at 14:23

Need a svg figure

1 Answers1