Inch tick marks SVG pattern
This commit is contained in:
commit
28833cf2bc
25
index.html
Normal file
25
index.html
Normal file
@ -0,0 +1,25 @@
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
svg {
|
||||
background-color: darkgray;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<svg viewbox="-50 -50 3450 2450" xmlns="http://www.w3.org/2000/svg" stroke-width="20">
|
||||
<defs>
|
||||
<pattern id="inch-mark" x="0" y="0" width="2in" height="2in" patternUnits="userSpaceOnUse">
|
||||
<rect x="0" y="0" width="1in" height="2in" fill="black" />
|
||||
<rect x="1in" y="0" width="1in" height="2in" fill="white" />
|
||||
</pattern>
|
||||
|
||||
<pattern id="vert" href="#inch-mark" patternTransform="rotate(90)" />
|
||||
</defs>
|
||||
|
||||
<rect x="0" y="0" width="34in" height="22in" fill="Gainsboro" />
|
||||
<line x1="0" y1="0" x2="34in" y2="0" stroke="url(#inch-mark)" />
|
||||
<line x1="0" y1="0" x2="0" y2="22in" stroke="url(#vert)" />
|
||||
</svg>
|
||||
</body>
|
||||
</html>
|
Loading…
x
Reference in New Issue
Block a user