Web Dev Solutions

Catalin Mititiuc

aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorCatalin Mititiuc <Catalin.Mititiuc@gmail.com>2024-03-14 13:15:36 -0700
committerCatalin Mititiuc <Catalin.Mititiuc@gmail.com>2024-03-14 13:15:36 -0700
commit28833cf2bce2562b01517165625bc94bb93304d4 (patch)
treea87e788a41e807141e71a05ed831d525b89bb305 /index.html
Inch tick marks SVG pattern
Diffstat (limited to 'index.html')
-rw-r--r--index.html25
1 files changed, 25 insertions, 0 deletions
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..beedf96
--- /dev/null
+++ b/index.html
@@ -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> \ No newline at end of file