SVG Path Pattern (Branch 6475)
✨ NOPPANUT KHAMMUEANG
<html> <head> <title>Let's Start </title> <style> body{ background:#f1f6ff; margin:1rem; text-align:center; font-family:sans-serif; } svg{ background:white; box-shadow:0 0 20px #0001; width:100%; } </style> </head> <body> <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <!-- <circle r="5" cx="5" cy="5" fill="red"/> --> <defs> <pattern id="texture1" viewBox="0,0,40,40" width="40%" height="40%"> <path d=" m10 4 c -2 4, -2 4,-6 6 c 4 2, 4 2 ,6 6 c 2 -4, 2 -4 ,6 -6 c -4 -2, -4 -2,-6 -6 " fill="black" stroke-linecap="round" stroke-linejoin="round" /> <path d=" m10 6 c -1 1, -1.5 3,-1 3 c 0 0, 0 0,-3 1 c 0 0, 0 0,3 1 c 0 0, 0 0, 1 3 c 0 0, 0 0, 1 -3 c 0 0, 0 0,3 -1 c 0 0, 0 0,-3 -1 c 0 0, 0 0, -1 -3 " fill="red" /> <circle r="1" cx="10" cy="10" fill="black"/> <path d=" m30 25 c -2 3, -2 3,-5 5 c 3 2, 3 2 ,5 5 c 2 -3, 2 -3 ,5 -5 c -3 -2, -3 -2 ,-5 -5 " fill="black" /> <path d=" m30 26 c 0 0, 0 0,-1 3 c 0 0, 0 0,-3 1 c 0 0, 0 0,3 1 c 0 0, 0 0, 1 3 c 0 0, 0 0, 1 -3 c 0 0, 0 0,3 -1 c 0 0, 0 0,-3 -1 " fill="white" /> <path d=" m20 15 c 0 0, 0 0,-1 3 c 0 0, 0 0,-3 1 c 0 0, 0 0,3 1 c 0 0, 0 0, 1 3 c 0 0, 0 0, 1 -3 c 0 0, 0 0,3 -1 c 0 0, 0 0,-3 -1 " fill="black" /> <circle r="1" cx="20" cy="19" fill="white"/> <circle r="1" cx="30" cy="30" fill="black"/> <circle r="5" cx="10" cy="30" fill="black"/> <circle r="1.9" cx="10" cy="27.5" fill="white"/> <circle r="1.9" cx="7.5" cy="30" fill="white"/> <circle r="1.9" cx="12.5" cy="30" fill="white"/> <circle r="1.9" cx="10" cy="32.5" fill="white"/> <circle r="1" cx="10" cy="30" fill="black"/> <text x="28" y="15" font-size="15" font-family="Georgia" font-weight="00" font-style="italic">L</text> <text x="27" y="13" font-size="15" font-family="Georgia" font-weight="00" >V</text> </pattern> </defs> <!-- ใช้ pattern --> <rect width="100" height="100" fill="url(#texture1)"/> </svg> </body> </html>