: SVG prevent stroke from eating near chars I'm trying to build web text editor based on SVG, i want the outline/stroke to be always behind the text, currently SVGs looks like this <svg width="209.00049363057323"

I'm trying to build web text editor based on SVG, i want the outline/stroke to be always behind the text, currently SVGs looks like this

<svg width="209.00049363057323" height="62.000025477707005" viewBox="0 0 164.84375 54.34375" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="none"><g id="0.6622862991524896"><text fill="#FFFFFF" stroke="#1a2234" stroke-width="15.3428571428571425" stroke-linecap="round" stroke-linejoin="round" x="" y="" text-anchor="start" font-size="24px" style="paint-order: stroke;" data-textcurve="-74" data-itemzoom="1 1" data-textspacing="0" itemzoom="0.7887260765550239 0.8765120967741935" data-stroke="rgba(0, 0, 0, 0)" fill-rule="evenodd"><textPath xlink:href="#textPath-item-2"><tspan dy="0">Vestaburg High </tspan></textPath></text></g><defs><path id="textPath-item-2" d="M 5.46875 20.359375 A 128.52837025907655 128.52837025907655 0 0 0 160.16935824632242 20.359374999999986"></path></defs></svg>

jsfiddle.net/z3pa9a8q/
How can i fix that, so white text always stays on foreground?

10.01% popularity Vote Up Vote Down

: How to undo expand appearence? I made this vector illustration in Ai but after expanding the appearence there seems to be too many anchor points even double ones so now when I am trying to

@Ogunnowo857

Posted in: #AdobeIllustrator

2 Comments

: How do I achieve this style of line that is smooth and consistent with corners? I would like to know an efficient way to achieve this style of line that is consistent and smooth, especially

@Ogunnowo857

Posted in: #AdobeIllustrator #AdobePhotoshop #Drawing #Illustration #LineArt

1 Comments

: How can I get the marquee tool in Photoshop to accurately snap to a grid? Currently I am working with a 128 x 128 image in Photoshop. I have grid lines dividing it into 9 sub-sections. When

@Ogunnowo857

Posted in: #MarqueeTool

1 Comments

: How do I make Illustrator export for screens at Does anyone have a method by which I can export in Illustrator at <0.5x? It seems -- unlike Photoshop -- if I attempt to export @0.33x,

@Ogunnowo857

Posted in: #AdobeIllustrator #Export

1 Comments

Login to post a comment!

1 Comments

Sorted by latest first Latest Oldest Best

@Yeniel278

From the perspective of someone who uses Adobe Illustrator, there's two possible way to achieve this.
1. Converting the text to outlines: While working with text you can't change the direction of the stroke unless you convert the text to outlines.
Select the text, go to Type > Create Outlines. Once the text has being converted, open the Stroke menu and click in this icon (the one rounded with yellow):

This way the stroke will stay away from the graphic (This option is not available when the graphic is a text element).

2. Pasting the same text in front. Just copy your text (ctrl + c) and paste it in front (ctrl + f), put the stroke to 0 and the fill color in white in the text you pasted in front. Save as an SVG.

10% popularity Vote Up Vote Down

Feed

: SVG prevent stroke from eating near chars I'm trying to build web text editor based on SVG, i want the outline/stroke to be always behind the text, currently SVGs looks like this <svg width="209.00049363057323"

More posts by @Ogunnowo857

: How to undo expand appearence? I made this vector illustration in Ai but after expanding the appearence there seems to be too many anchor points even double ones so now when I am trying to

: How do I achieve this style of line that is smooth and consistent with corners? I would like to know an efficient way to achieve this style of line that is consistent and smooth, especially

: How can I get the marquee tool in Photoshop to accurately snap to a grid? Currently I am working with a 128 x 128 image in Photoshop. I have grid lines dividing it into 9 sub-sections. When

: How do I make Illustrator export for screens at Does anyone have a method by which I can export in Illustrator at <0.5x? It seems -- unlike Photoshop -- if I attempt to export @0.33x,

Login to post a comment!

1 Comments

Back to top | Use Dark Theme