Pattern can
be developed or made from SVG images or the SVG shapes in SVG. It can also be made
from bitmap images, the structure of SVG pattern is like tiles which are made
in Photoshop. The main purpose of SVG fill patterns is to fill a shape with a
pattern which is made from images.
Example:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>SVG Example</title>
</head>
<body>
<h2>A Basic Example of Pattern</h2>
<svg width="120" height="120" viewBox="0 0 120 120">
<defs>
<pattern id="Triangle"
width="10" height="10"
patternUnits="userSpaceOnUse">
<polygon points="5,0 10,10 0,10"/>
</pattern>
</defs>
<circle cx="60" cy="60" r="50"
fill="url(#Triangle)"/>
</svg>
</body>
</html> 
No comments:
Post a Comment