A gap between lines of joined path in illustrator

I have created a logo with pen tool in Illustrator but between lines (where they intersect with each other) there is a gap where it gets the color of the background.

Something like this:

(Black color is the background color) – As you can see where the paths join each other there is a kinda dotted black line. I Grouped them but still the same. I converted to jpeg just to be sure it is not only shown like that but same effect.

NOTE: I want to export that logo as SVG file type and use it in the WEB. I tried some solutions given like anti-aliasing in preferences or art optimize when saving for optimization. But still I have same problem. I want to get that logo in SVG and put it on the web where it will display clean without those strange gaps.

How can i get rid of this?

enter image description here


Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Select all objects, and go to Object > Path > Offset Path to offset all the objects to 0.1mm. that should work

Method 2

Illustrator’s anti-aliasing can be troublesome at times.

In situations like this I’ve found it best to simply add a new object behind things that is the same, solid, color of the object above.

In your case, I’d add a new “teal” colored shape behind all the existing “teal” colored shapes. This will cause Illustrator to anti-alias to a “teal”, rather than the background black.

Another solution is to group the “teal” objects, and add a new solid “teal” fill to the group, behind the contents, via the Appearance Panel. I don’t know how using the Appearance Panel method may effect your SVG output though.

Method 3

Most likely your paths that you penned out are not ‘touching’ meaning that the paths are not perfectly touching to prevent the gap between the different objects. If this is the case you could try to adjust the objects to touch.

Method 4

Using the same colour to create a ‘background’ behind the element only works if using the same colour (or very similar), otherwise you could be there all day.

If your design has many colours the best way is to use object>path>offset path.

Just tried it, worked perfectly.

*EDIT – obviously this will offset your points, this is preferable to the black lines for me however.

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Notify of

Inline Feedbacks
View all comments
Would love your thoughts, please comment.x