[css-images-4][editorial] Improved examples for stripes() function

css-images-4/Overview.bs

@@ -2036,7 +2036,7 @@ Color Stop “Fixup”</h4>
 		giving red 1 share and green 2 shares of the 300px remaining
 		after subtracting blue's 100px from the 400px total.
 
-		<img src="images/stripes-example-33-1.png" style="height:1em; width:400px;" alt="example 1">
+		<img src="images/stripes1.svg" style="height:1em; width:400px;" alt="">
 
 		On the other hand,
 		''stripes(red .1fr, green .2fr, blue 100px)''
@@ -2049,7 +2049,7 @@ Color Stop “Fixup”</h4>
 		which is then distributed in the 1:2 ratio
 		dictated by the <<flex>> values.
 
-		<img src="images/example33-2.png" style="height: 1em; width:400px;" alt="example 2">
+		<img src="images/stripes2.svg" style="height:1em; width:400px;" alt="">
 
 		(This is similar to how [=flex layout=] deals with small <<flex>> sums on a line,
 		and ensures smoothly continuous behavior