Outlined Text in SVGs

Embedded styling in SVGs did not work. Had to outline text and resave.
This commit is contained in:
2018-10-17 21:29:18 -04:00
parent 95ce51d690
commit a1127b3c74
6 changed files with 114 additions and 6 deletions

View File

@@ -1 +1,18 @@
<svg height="72" viewBox="0 0 8 72" width="8" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" transform="matrix(-1 0 0 1 8 0)"><rect fill="#48484a" fill-rule="nonzero" height="72" rx="4" width="8"/><text fill="#fcfcfc" font-family="Roboto-Regular, Roboto" font-size="10" transform="matrix(-1 0 0 1 8 0)"><tspan x="1.192383" y="34">4</tspan> <tspan x="1.192383" y="45">5</tspan></text></g><defs><style type="text/css">@import url('http://fonts.googleapis.com/css?family=Roboto');</style></defs></svg>
<?xml version="1.0" encoding="UTF-8"?>
<svg width="8px" height="72px" viewBox="0 0 8 72" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.1 (39012) - http://www.bohemiancoding.com/sketch -->
<title>45lbs-Plate</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="45lbs-Plate">
<g id="Group" transform="translate(4.000000, 36.000000) scale(-1, 1) translate(-4.000000, -36.000000) ">
<rect id="Rectangle-path" fill="#48484A" fill-rule="nonzero" x="0" y="0" width="8" height="72" rx="4"></rect>
<g transform="translate(4.000000, 36.000000) scale(-1, 1) translate(-4.000000, -36.000000) translate(1.000000, 26.000000)" fill="#FFFFFF">
<path d="M3.49804706,5.52441406 L3.49804706,2.35546875 L1.25683612,5.52441406 L3.49804706,5.52441406 Z M3.5126955,8 L3.5126955,6.29101562 L0.44628925,6.29101562 L0.44628925,5.43164062 L3.64941425,0.98828125 L4.39160175,0.98828125 L4.39160175,5.52441406 L5.42187519,5.52441406 L5.42187519,6.29101562 L4.39160175,6.29101562 L4.39160175,8 L3.5126955,8 Z" id="4"></path>
<path d="M1.42773456,17.2177734 C1.48632861,17.719078 1.71907367,18.0657542 2.12597675,18.2578125 C2.33431112,18.3554692 2.57519413,18.4042969 2.848633,18.4042969 C3.36946894,18.4042969 3.75520727,18.2382829 4.00585956,17.90625 C4.25651186,17.5742171 4.38183612,17.2063822 4.38183612,16.8027344 C4.38183612,16.3144507 4.23291183,15.9368503 3.93505878,15.6699219 C3.63720573,15.4029935 3.27995019,15.2695312 2.86328144,15.2695312 C2.56054555,15.2695312 2.30094528,15.3281244 2.08447284,15.4453125 C1.86800041,15.5625006 1.68326918,15.7252594 1.53027362,15.9335938 L0.768554875,15.8896484 L1.30078144,12.125 L4.93359394,12.125 L4.93359394,12.9746094 L1.95996112,12.9746094 L1.66210956,14.9179688 C1.82487079,14.7942702 1.97949164,14.7014977 2.12597675,14.6396484 C2.38639472,14.532226 2.68749848,14.4785156 3.02929706,14.4785156 C3.67057631,14.4785156 4.21419067,14.6852193 4.66015644,15.0986328 C5.10612221,15.5120463 5.32910175,16.0361296 5.32910175,16.6708984 C5.32910175,17.331709 5.12483947,17.9143855 4.71630878,18.4189453 C4.30777809,18.9235051 3.65592914,19.1757812 2.76074237,19.1757812 C2.19107807,19.1757812 1.68733962,19.0154638 1.24951191,18.6948242 C0.811684196,18.3741846 0.566732219,17.8818393 0.514648625,17.2177734 L1.42773456,17.2177734 Z" id="5"></path>
</g>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 521 B

After

Width:  |  Height:  |  Size: 2.5 KiB