Creating SVG flag

Navigation

• •

This article describes creating SVG flag in Inkscape (version 0.46, Windows).

For creating a SVG flag you need to install:

• Inkscape - An Open Source vector graphics editor, with capabilities similar to Illustrator, CorelDraw, or Xara X, using the W3C standard Scalable Vector Graphics (SVG) file format.

Open your Inkscape. Go to New » Default. We will make a flag with 500 x 330px size so it can be used for creating a flag with glance effect in GIMP (see this article). Go to Files » Document Properities and set the width and height of the document (Custom size: 500 x 330px). As an example we will make a czech national flag. In czech national flag the following 3 colors are used:

• red: #d7141a (#d7141aff), RGB 215 20 25 (255 for opacity)
• blue: #11457e (#11457eff), RGB 17 69 126 (255 for opacity)
• white: #ffffff (#ffffffff), RGB 255 255 255 (255 for opacity).

Click on Retangles and squares (  ) icon in Tool Box and change the values in the Tool Controls.

Set:

• W (width): 500px
• H (height): 165px
• Rx (horizontal radius): 0px
• Ry:(vertical radius): 0px.

Click on Select and transform objects (  ) in Tool Box and select the created retangle and set:

• X (horizontal coordinate): 0px
• Y (vertical coordinate): 0px

in the Tool Controls.

At the bottom of Inkscape double click on Fill color (  ), so the fill tab will be open on the right side of Inkscape.

Set the red color here:

• R: 215
• G: 20
• B: 25
• A: 255

Red retangle is done. Now we do white retangle, the same way as the red retangle. Click on Retangles ans squares (  ) icon in Tool Box and change the values in the Tool Controls.

Set:

• W (width): 500px
• H (height): 165px
• Rx (horizontal radius): 0px
• Ry:(vertical radius): 0px

Click on Select and transform objects (  ) in Tool Box and select the created retangle and set:

• X (horizontal coordinate): 0px
• Y (vertical coordinate): 165px

in the Tool Controls.

At the bottom of Inkscape page double click on Fill color (  ), so the fill tab will be open on the right side of Inkscape. Set the white color here:

• R: 255
• G: 255
• B: 255
• A: 255

Last we will make a blue triangle. Click on Create stars and polygon (  ). Set:

• Corners: 3

While creating the triangle hold CTRL to snap angle.

After creating a triangle (any size) click on Select and transform objects (  ) in Tool Box and select the created triangle and set:

• X (horizontal coordinate): 0px
• Y (vertical coordinate): 0px
• W (width): 250px
• H (height): 330px.

At the bottom of Inkscape page double click on Fill color (  ), so the fill tab will be open on the right side of Inkscape. Set the blue color here:

• R: 17
• G: 69
• B: 126
• A: 255

Now the flag is created and you can save it as SVG file. File » Save as. Such SVG file can be opened and edited in GIMP. See examples.

The following flag is SVG image.

• •