We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Hi! I've got two SVG files, one of which is displayed good, while the other just looks blank when rendered.
Sketch editor, for instance, reads them both, as well as Chrome.
This one works: <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <g fill="none" fill-rule="evenodd"> <g fill-rule="nonzero" transform="translate(0 2)"> <path fill="#4BFAF9" d="M4.52871199 15.2304965C9.32741671 15.2304965 14.1054966 15.2304965 18.8904515 15.2304965 18.8904515 14.0070922 18.8904515 12.7777778 18.8904515 11.5484634 18.3817063 11.5484634 17.8867109 11.5484634 17.3710908 11.5484634 17.3710908 10.5141844 17.3710908 9.49172577 17.3710908 8.45744681 17.4192154 8.45744681 17.460465 8.45744681 17.5085895 8.45744681 18.1479585 8.45744681 18.7942024 8.45744681 19.4404463 8.45744681 21.1798049 8.46335697 22.5960415 9.51536643 22.8572891 10.998818 22.8847888 11.1465721 22.8916637 11.2943262 22.8916637 11.4420804 22.8916637 12.7541371 22.8916637 14.0661939 22.8916637 15.3782506 22.8916637 17.0153664 21.3723031 18.3274232 19.467946 18.3274232 14.2911199 18.3274232 9.11429372 18.3274232 3.93746757 18.3274232 2.21185885 18.3274232.7543726 17.2340426.541249611 15.7742317.479375195 15.3486998.51374987 14.9113475.5 14.4739953.5 14.3853428.575624286 14.391253.630623768 14.3735225 1.33186715 14.1903073 2.03998547 14.0070922 2.74810379 13.8179669 3.33247327 13.6643026 3.91684276 13.5106383 4.52183705 13.3510638 4.52871199 13.9775414 4.52871199 14.5981087 4.52871199 15.2304965zM5.09245667 4.77541371C5.09245667 6.00472813 5.09245667 7.22222222 5.09245667 8.45153664 5.60120187 8.45153664 6.10307213 8.45153664 6.61869227 8.45153664 6.61869227 9.4858156 6.61869227 10.5082742 6.61869227 11.5425532 6.56369279 11.5425532 6.52244318 11.5484634 6.47431863 11.5484634 5.8418246 11.5484634 5.20933057 11.5484634 4.57683653 11.5484634 2.86497769 11.5484634 1.48311572 10.5673759 1.15999377 9.12529551 1.11874416 8.94208038 1.10499429 8.75886525 1.10499429 8.57565012 1.10499429 7.26950355 1.10499429 5.96335697 1.10499429 4.6572104 1.10499429 3.16193853 2.301233 1.95626478 4.01309185 1.71394799 4.18496523 1.69030733 4.36371354 1.68439716 4.54246186 1.68439716 9.70553814 1.68439716 14.8617395 1.68439716 20.0248158 1.68439716 21.7504245 1.68439716 23.1941609 2.74231678 23.4279087 4.20212766 23.496658 4.64539007 23.4622833 5.10047281 23.4691583 5.54964539 23.4691583 5.57919622 23.4004089 5.62647754 23.3454094 5.63829787 22.754165 5.79787234 22.1629206 5.95153664 21.5716762 6.10520095 20.9116824 6.27659574 20.2516886 6.45390071 19.5916949 6.62529551 19.5435703 6.63711584 19.5023207 6.64893617 19.4404463 6.65484634 19.4404463 6.02836879 19.4404463 5.40780142 19.4404463 4.78132388 14.6623664 4.77541371 9.88428646 4.77541371 5.09245667 4.77541371z"/> <path fill="#FFED00" d="M16.0442283,10.0118203 C13.4386279,11.1347518 10.8674022,12.2399527 8.28242657,13.3510638 C8.28242657,11.1229314 8.28242657,8.90661939 8.28242657,6.678487 C10.8674022,7.78959811 13.4386279,8.89479905 16.0442283,10.0118203 Z"/> </g> <polygon points="0 0 24 0 24 24 0 24"/> </g> </svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <g fill="none" fill-rule="evenodd"> <g fill-rule="nonzero" transform="translate(0 2)"> <path fill="#4BFAF9" d="M4.52871199 15.2304965C9.32741671 15.2304965 14.1054966 15.2304965 18.8904515 15.2304965 18.8904515 14.0070922 18.8904515 12.7777778 18.8904515 11.5484634 18.3817063 11.5484634 17.8867109 11.5484634 17.3710908 11.5484634 17.3710908 10.5141844 17.3710908 9.49172577 17.3710908 8.45744681 17.4192154 8.45744681 17.460465 8.45744681 17.5085895 8.45744681 18.1479585 8.45744681 18.7942024 8.45744681 19.4404463 8.45744681 21.1798049 8.46335697 22.5960415 9.51536643 22.8572891 10.998818 22.8847888 11.1465721 22.8916637 11.2943262 22.8916637 11.4420804 22.8916637 12.7541371 22.8916637 14.0661939 22.8916637 15.3782506 22.8916637 17.0153664 21.3723031 18.3274232 19.467946 18.3274232 14.2911199 18.3274232 9.11429372 18.3274232 3.93746757 18.3274232 2.21185885 18.3274232.7543726 17.2340426.541249611 15.7742317.479375195 15.3486998.51374987 14.9113475.5 14.4739953.5 14.3853428.575624286 14.391253.630623768 14.3735225 1.33186715 14.1903073 2.03998547 14.0070922 2.74810379 13.8179669 3.33247327 13.6643026 3.91684276 13.5106383 4.52183705 13.3510638 4.52871199 13.9775414 4.52871199 14.5981087 4.52871199 15.2304965zM5.09245667 4.77541371C5.09245667 6.00472813 5.09245667 7.22222222 5.09245667 8.45153664 5.60120187 8.45153664 6.10307213 8.45153664 6.61869227 8.45153664 6.61869227 9.4858156 6.61869227 10.5082742 6.61869227 11.5425532 6.56369279 11.5425532 6.52244318 11.5484634 6.47431863 11.5484634 5.8418246 11.5484634 5.20933057 11.5484634 4.57683653 11.5484634 2.86497769 11.5484634 1.48311572 10.5673759 1.15999377 9.12529551 1.11874416 8.94208038 1.10499429 8.75886525 1.10499429 8.57565012 1.10499429 7.26950355 1.10499429 5.96335697 1.10499429 4.6572104 1.10499429 3.16193853 2.301233 1.95626478 4.01309185 1.71394799 4.18496523 1.69030733 4.36371354 1.68439716 4.54246186 1.68439716 9.70553814 1.68439716 14.8617395 1.68439716 20.0248158 1.68439716 21.7504245 1.68439716 23.1941609 2.74231678 23.4279087 4.20212766 23.496658 4.64539007 23.4622833 5.10047281 23.4691583 5.54964539 23.4691583 5.57919622 23.4004089 5.62647754 23.3454094 5.63829787 22.754165 5.79787234 22.1629206 5.95153664 21.5716762 6.10520095 20.9116824 6.27659574 20.2516886 6.45390071 19.5916949 6.62529551 19.5435703 6.63711584 19.5023207 6.64893617 19.4404463 6.65484634 19.4404463 6.02836879 19.4404463 5.40780142 19.4404463 4.78132388 14.6623664 4.77541371 9.88428646 4.77541371 5.09245667 4.77541371z"/> <path fill="#FFED00" d="M16.0442283,10.0118203 C13.4386279,11.1347518 10.8674022,12.2399527 8.28242657,13.3510638 C8.28242657,11.1229314 8.28242657,8.90661939 8.28242657,6.678487 C10.8674022,7.78959811 13.4386279,8.89479905 16.0442283,10.0118203 Z"/> </g> <polygon points="0 0 24 0 24 24 0 24"/> </g> </svg>
This doesn't: <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <g fill="none" fill-rule="evenodd"> <polygon points="0 0 24 0 24 24 0 24"/> <path fill="#7A869A" d="M19.5,3 L24,3 L24,0 L12,0 L12,3 L16.5,3 L16.5,12 L19.5,12 L19.5,3 Z M0,12 L3,12 L3,24 L0,24 L0,12 Z M9,12 L12,12 L12,24 L9,24 L9,12 Z M6,21 L3,17.25 L3,12 L6,16.5 L9,12 L9,17.25 L6,21 Z"/> <path fill="#172B4D" d="M7.125,3 L3,3 L3,6 L7.125,6 C7.95342712,6 8.625,5.32842712 8.625,4.5 C8.625,3.67157288 7.95342712,3 7.125,3 Z M6.25,9 L3,9 L3,12 L0,12 L0,8.25 L0,0 L7.5,0 C9.98528137,0 12,2.01471863 12,4.5 C12,6.21073267 11.0453865,7.69850342 9.63978869,8.45968304 L12,12 L8.25,12 L6.25,9 Z M19.125,15 L15,15 L15,18 L19.125,18 C19.9534271,18 20.625,17.3284271 20.625,16.5 C20.625,15.6715729 19.9534271,15 19.125,15 Z M15,21 L15,24 L12,24 L12,20.25 L12,12 L19.5,12 C21.9852814,12 24,14.0147186 24,16.5 C24,18.9852814 21.9852814,21 19.5,21 L15,21 Z"/> </g> </svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <g fill="none" fill-rule="evenodd"> <polygon points="0 0 24 0 24 24 0 24"/> <path fill="#7A869A" d="M19.5,3 L24,3 L24,0 L12,0 L12,3 L16.5,3 L16.5,12 L19.5,12 L19.5,3 Z M0,12 L3,12 L3,24 L0,24 L0,12 Z M9,12 L12,12 L12,24 L9,24 L9,12 Z M6,21 L3,17.25 L3,12 L6,16.5 L9,12 L9,17.25 L6,21 Z"/> <path fill="#172B4D" d="M7.125,3 L3,3 L3,6 L7.125,6 C7.95342712,6 8.625,5.32842712 8.625,4.5 C8.625,3.67157288 7.95342712,3 7.125,3 Z M6.25,9 L3,9 L3,12 L0,12 L0,8.25 L0,0 L7.5,0 C9.98528137,0 12,2.01471863 12,4.5 C12,6.21073267 11.0453865,7.69850342 9.63978869,8.45968304 L12,12 L8.25,12 L6.25,9 Z M19.125,15 L15,15 L15,18 L19.125,18 C19.9534271,18 20.625,17.3284271 20.625,16.5 C20.625,15.6715729 19.9534271,15 19.125,15 Z M15,21 L15,24 L12,24 L12,20.25 L12,12 L19.5,12 C21.9852814,12 24,14.0147186 24,16.5 C24,18.9852814 21.9852814,21 19.5,21 L15,21 Z"/> </g> </svg>
The text was updated successfully, but these errors were encountered:
and this doesn't: <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" > <rect x="2" y="2" fill="#000000" width="20" height="20"/> <rect x="12" y="12" fill="#FFFFFF" width="8" height="8"/> <rect x="4" y="4" fill="#FFFFFF" width="8" height="8"/> </svg>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" > <rect x="2" y="2" fill="#000000" width="20" height="20"/> <rect x="12" y="12" fill="#FFFFFF" width="8" height="8"/> <rect x="4" y="4" fill="#FFFFFF" width="8" height="8"/> </svg>
Sorry, something went wrong.
No branches or pull requests
Hi!
I've got two SVG files, one of which is displayed good, while the other just looks blank when rendered.
Sketch editor, for instance, reads them both, as well as Chrome.
This one works:
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <g fill="none" fill-rule="evenodd"> <g fill-rule="nonzero" transform="translate(0 2)"> <path fill="#4BFAF9" d="M4.52871199 15.2304965C9.32741671 15.2304965 14.1054966 15.2304965 18.8904515 15.2304965 18.8904515 14.0070922 18.8904515 12.7777778 18.8904515 11.5484634 18.3817063 11.5484634 17.8867109 11.5484634 17.3710908 11.5484634 17.3710908 10.5141844 17.3710908 9.49172577 17.3710908 8.45744681 17.4192154 8.45744681 17.460465 8.45744681 17.5085895 8.45744681 18.1479585 8.45744681 18.7942024 8.45744681 19.4404463 8.45744681 21.1798049 8.46335697 22.5960415 9.51536643 22.8572891 10.998818 22.8847888 11.1465721 22.8916637 11.2943262 22.8916637 11.4420804 22.8916637 12.7541371 22.8916637 14.0661939 22.8916637 15.3782506 22.8916637 17.0153664 21.3723031 18.3274232 19.467946 18.3274232 14.2911199 18.3274232 9.11429372 18.3274232 3.93746757 18.3274232 2.21185885 18.3274232.7543726 17.2340426.541249611 15.7742317.479375195 15.3486998.51374987 14.9113475.5 14.4739953.5 14.3853428.575624286 14.391253.630623768 14.3735225 1.33186715 14.1903073 2.03998547 14.0070922 2.74810379 13.8179669 3.33247327 13.6643026 3.91684276 13.5106383 4.52183705 13.3510638 4.52871199 13.9775414 4.52871199 14.5981087 4.52871199 15.2304965zM5.09245667 4.77541371C5.09245667 6.00472813 5.09245667 7.22222222 5.09245667 8.45153664 5.60120187 8.45153664 6.10307213 8.45153664 6.61869227 8.45153664 6.61869227 9.4858156 6.61869227 10.5082742 6.61869227 11.5425532 6.56369279 11.5425532 6.52244318 11.5484634 6.47431863 11.5484634 5.8418246 11.5484634 5.20933057 11.5484634 4.57683653 11.5484634 2.86497769 11.5484634 1.48311572 10.5673759 1.15999377 9.12529551 1.11874416 8.94208038 1.10499429 8.75886525 1.10499429 8.57565012 1.10499429 7.26950355 1.10499429 5.96335697 1.10499429 4.6572104 1.10499429 3.16193853 2.301233 1.95626478 4.01309185 1.71394799 4.18496523 1.69030733 4.36371354 1.68439716 4.54246186 1.68439716 9.70553814 1.68439716 14.8617395 1.68439716 20.0248158 1.68439716 21.7504245 1.68439716 23.1941609 2.74231678 23.4279087 4.20212766 23.496658 4.64539007 23.4622833 5.10047281 23.4691583 5.54964539 23.4691583 5.57919622 23.4004089 5.62647754 23.3454094 5.63829787 22.754165 5.79787234 22.1629206 5.95153664 21.5716762 6.10520095 20.9116824 6.27659574 20.2516886 6.45390071 19.5916949 6.62529551 19.5435703 6.63711584 19.5023207 6.64893617 19.4404463 6.65484634 19.4404463 6.02836879 19.4404463 5.40780142 19.4404463 4.78132388 14.6623664 4.77541371 9.88428646 4.77541371 5.09245667 4.77541371z"/> <path fill="#FFED00" d="M16.0442283,10.0118203 C13.4386279,11.1347518 10.8674022,12.2399527 8.28242657,13.3510638 C8.28242657,11.1229314 8.28242657,8.90661939 8.28242657,6.678487 C10.8674022,7.78959811 13.4386279,8.89479905 16.0442283,10.0118203 Z"/> </g> <polygon points="0 0 24 0 24 24 0 24"/> </g> </svg>This doesn't:
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <g fill="none" fill-rule="evenodd"> <polygon points="0 0 24 0 24 24 0 24"/> <path fill="#7A869A" d="M19.5,3 L24,3 L24,0 L12,0 L12,3 L16.5,3 L16.5,12 L19.5,12 L19.5,3 Z M0,12 L3,12 L3,24 L0,24 L0,12 Z M9,12 L12,12 L12,24 L9,24 L9,12 Z M6,21 L3,17.25 L3,12 L6,16.5 L9,12 L9,17.25 L6,21 Z"/> <path fill="#172B4D" d="M7.125,3 L3,3 L3,6 L7.125,6 C7.95342712,6 8.625,5.32842712 8.625,4.5 C8.625,3.67157288 7.95342712,3 7.125,3 Z M6.25,9 L3,9 L3,12 L0,12 L0,8.25 L0,0 L7.5,0 C9.98528137,0 12,2.01471863 12,4.5 C12,6.21073267 11.0453865,7.69850342 9.63978869,8.45968304 L12,12 L8.25,12 L6.25,9 Z M19.125,15 L15,15 L15,18 L19.125,18 C19.9534271,18 20.625,17.3284271 20.625,16.5 C20.625,15.6715729 19.9534271,15 19.125,15 Z M15,21 L15,24 L12,24 L12,20.25 L12,12 L19.5,12 C21.9852814,12 24,14.0147186 24,16.5 C24,18.9852814 21.9852814,21 19.5,21 L15,21 Z"/> </g> </svg>The text was updated successfully, but these errors were encountered: