I want create two parts:

But i have a very big problem with this.
I use INKSCAPE to edit .SVG file but after correct upload it to project i can’t add the pad for board.

I want create project with this two board i a need help.
It is my parts:

Very thanks for help!

This is perhaps going to be more complex than you are expecting, parts editor likely isn’t going to be able to do it. It looks like you are starting from the png files (not necessarily a bad place to start on something complex like this) so first it is desirable to convert the png to vector in Inkscape using the trace bit map function under path I think (likely Old_Grey’s video tutorial here shows how):

I’ve never had much luck with it, I’m more likely to use cut and paste in Inkscape to build up the necessary breadboard view by grabbing appropriate bits from other parts and then editing the files to add the connectors (which can be fairly complex til you know what you are doing). In this case assuming you start from the png and get it imported as an svg, you would then need to scale the image so the
connectors are on the .1 grif (it looks like they have, as so many do, offset some of the connectors by .05 though). Then I would usually use cut and paste in Inkscape to copy the breadboard view of a appropriately size .1 connector in to the svg and then edit the connections to their necessary values (the import will give them odd names because the connector numbers will collide). If you can get the pngs imported, vectorized and scaled to the .1 grid I’ll insert a connector (with directions on how to do it) and set the pins as an example and you can do the rest. Schematic is likely to be challenging as you need to split the 3 dimensional pins in to groups that will fit in the edges of a square but just putting the rows side by side along the square should do it. It looks like you mostly have pcb ok (at least at the pad level, the silk screen doesn’t have sufficient definition of the lines to render anything) although the connector names will likely need to change to match breadboard. You can upload the fzpz file to the forum directly by using the upload button (seventh from the left on the reply tool bar).


What problem are you having?

The “Untitled Sketch 2_bb.svg” imports fine into the part - import svg in FZ part edit - , it’s just that the “px” has to be removed in the XML to fix the fonts. The PCB pads import fine also, but it needs some work because the pads don’t work.

From what I can gather, you had a png(Romeo V2.png) and you converted it to a svg(Romeo V2.svg). Then you made a BB svg(Untitled Sketch 2_bb.svg). Then you made a PCB svg(Untitled Sketch 2_pcb.svg) and the pads don’t work.

Here is an example of what I meant above:

start from Romeo V2.svg (the png image as an svg).

convert it to an svg via trace if desired (I didn’t in this case)

In Inkscape select the entire png image, set the tool bar to mm and set w 93.0 h 88.0

as that aligns the edges of the 8pin and one of the 3 pin connectors (for height) on to the .1 grid and hopefully sets the scale correctly…

Done by align a major grid line on a visible edge of the top of a connector

see how far off the same point on the connector 3 down (or across) is to the .3 in grid line.

Change the height or width til the edges align on .1 centers and your scale should be correct.

Now start fritzing, drag a connector to breadboard and set it to 3 pins female. Edit it with parts editor, save as new part, export part as 3pin generic header. Repeat this for 3pin male connnector and 8 pin male and female connectors. I only did the 3 pin female here. Exit Fritzing.

Use 7zip (or similar) to unzip the ‘Generic female header - 3 pins.fzpz’ file in to a new directory then open the breadboard svg in Inkscape. Ungroup breadboard via cntl-shift-g (or the menu) Select the black rectanglar background and delete it leaving you with only the 3 square pins. Edit select all and copy in the Inkscape edit menu and paste it in to the Inkscape with Romeo V2.svg above the png (you will see what I mean in the attached svg file). That gives you a 3pin black female connector with the appropriate connector pins (but misnamed for now). You can drag that over top of the black 3 pin female connectors on the png as is. The red green and yellow ones need a bit more work. Dup your stand alone 3 pin black connector and move it beside the black one. Ungroup it if it is grouped (it may not be although you will want to group them again before placing them). Now we need to adjust the colors to match the ones on the board. Start with the one black connector and click on the 4 outer rectangles one at a time, I started on the left one:

left : style fill:#373737
top : style fill:#2a2a29
right: style fill:#474747
bot : style fill:#595959

someone a lot smarter than me has determined these colors give the illusion of a square connector. So now we need to change the colors. So with a hex calculator (I used the Windows one with view set to programmer and hex.) Lets start with the bottom as reference and calculate the differences from there:

5959595 - 474747 = 121212 or 595959 - 121212 = 474747 so adding 121212 to the base color will give the new color. So duplicate a bottom segment of the black connector and move it over the png beside a green connector. Now select the segement and with the color slider on the bottom of the Inkscape screen match the green color in the segment.In my case I figure that is style fill:#44aa00. That’s my new bot segment color. Now right is 44aa00 + 121212 or 56BC12 e\tc.

left : style fill:#66CC22
top : style fill:#73D930 + FFFFFFFFFFF2F2F2
right : style fill:#56BC12 + 1D1D1E
bot : style fill:#44aa00 + 121212

which produces the same effect in green ready to be over layed on the green connector (I see the color isn’t that good a match so you should adjust it until it is, I’m too lazy to :slight_smile: ). Once you have got this done post the svg and we will start configuring connectors and create a fpz file to go along with this.

(note: because the forum often won’t upload a svg file this is an svg file renamed to fzpz (which will upload) so rename it to .svg and it should open in Inkscape with the noted changes present.

Romeo V2 connectors.fzpz (187.9 KB)


I think the original question is confusing, because I don’t think it was the png to svg convert but this pad problem.

There are the 4 svg I think he created, but I don’t know why the part he created is blank.

After i upload my .SVG file i have blank froms in fritzing

I was use this guilde to convert this file to .SVG file but it’s don’t working.

Can i paste .PNG file to program and add point to cable?
How can i correct convert this two parts to friting?

Because the svgs aren’t really valid for fritzing. The lines exist as shapes but have no fill or stroke and adding either or both doesn’t make them render so I expect there is more missing.

I don’t believe you can add connectors in parts editor (although I rarely use parts editor and thus could be wrong). You need to have started from a template part that has predefined connections for all the pins and then you can modify them in parts editor (although I find editing the underlying files to be easier than using parts editor). The connectors also need to exist in the svg files (which they currently do not) so that needs to be done as well. The first thing to do likely is to make a list of all the connections you need on the board (starting with connector0 and going up) from the dfrobot connection diagram. Make a list such as this until every pin that you want to connect to in Fritzing has a pin number

fritzing con number dfrobot pin number
connector0 servo power+
connector1 servo power-
connector2 digital i/o 13 gnd
connector3 digital i/o 13 cw
connector4 digital i/o 13 O

until you have all the connectors listed. Now you need to add headers with their associated connector information as in my svg posted a couple of posts back. Once that is done you will need to edit the svg to set the connector names to the appropriate numbers from the list (such as digital i/o 13 ground would need to change to connector2pin and connector2terminal (although you only really need connector2pin in this case). Once thats all done you need to do the same in schematic and pcb and then create a fzp file to tie it all together. As you see this is a substantial amount of work.


So it was the png to svg.

You will have to play with setting to get a better quality

Hey Peter if you want to save time and switch to video examples I use OBS, it’s free, and then all you need is a microphone. It’s actually quicker making the video than uploading to Youtube when you know how to make parts.