SVG
Viewer
CbCNT1qs
N/A
Send feedback
Terms & Conditions
Privacy Policy
Rotate
Flip Y
Flip X
-1px x -1px
Change dimensions
Trim Padding
Optimize
1.57 KB
699 bytes
-57%
Prettify
Preferences
Clear
<svg xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges" preserveAspectRatio="xMidYMid meet" viewBox="-20 -20 140 140" height="20mm" width="20mm" version="1.2"> <g style="fill: blue; fill-opacity: 0.7;"> <rect y="0" x="0" height="20" width="20"></rect> <rect y="0" x="40" height="20" width="20"></rect> <rect y="0" x="80" height="20" width="20"></rect> <rect y="20" x="40" height="20" width="20"></rect> <rect y="40" x="0" height="20" width="20"></rect> <rect y="40" x="20" height="20" width="20"></rect> <rect y="40" x="60" height="20" width="20"></rect> <rect y="40" x="80" height="20" width="20"></rect> <rect y="80" x="40" height="20" width="20"></rect> </g> <defs> <mask maskContentUnits="userSpaceOnUse" id="Mask"> <rect style="fill-opacity: 0.5; fill: white;" y="-20" x="-20" height="140" width="140"></rect> <g style="fill: blue; fill-opacity: 1.0;"> <rect y="0" x="0" height="20" width="20"></rect> <rect y="0" x="40" height="20" width="20"></rect> <rect y="0" x="80" height="20" width="20"></rect> <rect y="20" x="40" height="20" width="20"></rect> <rect y="40" x="0" height="20" width="20"></rect> <rect y="40" x="20" height="20" width="20"></rect> <rect y="40" x="60" height="20" width="20"></rect> <rect y="40" x="80" height="20" width="20"></rect> <rect y="80" x="40" height="20" width="20"></rect> </g> </mask> </defs> <rect mask="url(#Mask)" style="fill-opacity: 1.0; fill: red;" y="-20" x="-20" height="140" width="140"></rect> </svg>
Upload
Copy
Download
Share
Preview
React
React Native
PNG
Data URI
100%
Download
SVG
Viewer
Edit
Export
Rotate
Flip Y
Flip X
-1px x -1px
Change dimensions
Trim Padding
Optimize
1.57 KB
699 bytes
-57%
Prettify
Preferences
Clear
<svg xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges" preserveAspectRatio="xMidYMid meet" viewBox="-20 -20 140 140" height="20mm" width="20mm" version="1.2"> <g style="fill: blue; fill-opacity: 0.7;"> <rect y="0" x="0" height="20" width="20"></rect> <rect y="0" x="40" height="20" width="20"></rect> <rect y="0" x="80" height="20" width="20"></rect> <rect y="20" x="40" height="20" width="20"></rect> <rect y="40" x="0" height="20" width="20"></rect> <rect y="40" x="20" height="20" width="20"></rect> <rect y="40" x="60" height="20" width="20"></rect> <rect y="40" x="80" height="20" width="20"></rect> <rect y="80" x="40" height="20" width="20"></rect> </g> <defs> <mask maskContentUnits="userSpaceOnUse" id="Mask"> <rect style="fill-opacity: 0.5; fill: white;" y="-20" x="-20" height="140" width="140"></rect> <g style="fill: blue; fill-opacity: 1.0;"> <rect y="0" x="0" height="20" width="20"></rect> <rect y="0" x="40" height="20" width="20"></rect> <rect y="0" x="80" height="20" width="20"></rect> <rect y="20" x="40" height="20" width="20"></rect> <rect y="40" x="0" height="20" width="20"></rect> <rect y="40" x="20" height="20" width="20"></rect> <rect y="40" x="60" height="20" width="20"></rect> <rect y="40" x="80" height="20" width="20"></rect> <rect y="80" x="40" height="20" width="20"></rect> </g> </mask> </defs> <rect mask="url(#Mask)" style="fill-opacity: 1.0; fill: red;" y="-20" x="-20" height="140" width="140"></rect> </svg>
Upload
Copy
Download
Share
Preview
React
React Native
PNG
Data URI
100%
Download