Dear all, welcome to this new tutorial! Let's discover Inkscape, a great
free solution to make professional vector drawings for Windows, MacOS and
Linux computers. In just 11 minutes we will see everything you can do
with Inkscape as a beginner.
Inkscape is a vector-based drawing software that works with .SVG files (or
(Scalable Vector Graphic files) that are often used in web development.
SVG files describe graphics with a textual markup language readable by
web browsers and very easy to manage and compress, without losing quality
like standard .jpg and .png bitmap files.
When you open Inkscape this starts from a blank document on the center,
several drawing tools on the left and useful panels and options on the
right that we will see. On top you get the main bar showing properties and
options for the current tool enabled or object selected.
There is also a dark theme you can select by going to Preferences...
and then to Interface, Theme.
Before working you may need to adjust the document page size with Document
Properties... Just select the standard template to use and the measurement
unit under Display units above.
Now let's see how to draw on Inkscape with several tools on the left
side.
You can drop rectangles, ellipses, regular polygons and stars by clicking
and dragging on the document. You can also draw 3D cubes and spirals in
the same way. You can also adjust size, corners and shape type on top.
You can enable other tools to realize custom shapes and paths. With the
Bezier tool click to fix several vertices and drop consecutive segments.
Whereas click and drag to define tangents to curves with very good
precision. Then close the shape or double-click to apply.
Use the options on top to change the drawing mode such as Spiro path to
drop arcs and circles and BSpline to drop Bspline curves.
Use the Freehand tool to drop segments by clicking twice or draw freehand
by clicking and dragging on the document. Whereas enable the calligraphic
tool to draw artistic paths, correcting trace properties on top.
With the Text tool you can drop text and annotations. Click and drag to
create a text area and then type in. If you overcome the text box this
becomes red in color and hides part of its content. In this case just
extend it as much as you need to show all.
On top adjust the font family, style, size, distribution, spacing and
orientation and set the text color from the complete list at the bottom.
These changes affect any selected text if you have.
Use your mouse wheel while holding down the CTRL key to zoom in and out.
You also have several graphic aids to make precise drawing such as the
horizontal and vertical rulers, showing your cursor position on the
document and several main guides you can drop by clicking and dragging
from the rulers.
On the extreme right you can set all the snapping options. You can turn ON
and OFF all snappings or choose to consider several object keypoints such
as paths, intersections, cusp and smooth nodes, midpoints and more.
You can also go to View, Split View Mode to move a separator that shows or
hides all object fillings and strokes to catch the vector skeletons.
Now let's see how to edit objects with the Select tool enabled.
Click on any object to select it and click and drag it to move it. This
shows its dashed box and several nodes you can use to scale the object.
Hold down the CTRL (or CMD) key to save its aspect ratio.
Click once again on the object to rotate and skew it instead. Use CTRL (or
CMD) and X, C and V to cut, copy and paste. You can always undo with CTRL
(or CMD) and Z.
Moreover if you double-click on the object you enable the corresponding
drawing tool, for example the rectangle tool if you double-click on any
rectangle or the spiral tool if you double-click on any spiral. At this
point you can drop another object or correct the current one by moving its
white nodes.
Whereas if you double-click on any curve or artistic path you enable the
edit tool, which can be used on several objects. Drag white circles to
adjust curves; white squares to correct straight lines and white rhombuses
to make complex adjustments, such as the extrusion length of the 3D cube.
On top you can transform the selected object. Rotate it by 90 degrees, flip
it horizontally or vertically and adjust its visibility in case multiple
objects overlap. Also set the object position, width, height and click on
the lock button to save its aspect ratio any time.
To adjust any object or text appearance you can open the panels in the
bottom right corner. With Fill and Stroke... you can add any filling with
Fill and any stroke with Stroke paint and style. You can apply any solid
color and any linear, radial or pattern gradient to both the filling and
the stroke independently. You can also enable the Gradient tool to manage
the gradients by moving nodes or clicking and dragging over the object.
Make sure to select any node to change the gradient color and pick any
color at the bottom to fix the overall background color. You can also add
blur and transparency at the bottom.
When selecting text the Fill represents the text color and the Stroke the
contour around each letter. Also in this case you can apply gradients as
you like most.
If you click and drag on the document you can select all the objects within
your rectangular selection area. This way you can move, scale and rotate
these in one move. You can also right-click and go to Group not to perform
the selection every time.
In addition you can select multiple objects and open the Path tab to apply
several boolean operations to unify, subtract and combine objects in
several ways.
Inkscape includes other advanced tools you can use. Enable the Spray tool
to drop multiple copies of a selected object as you brush and the Tweak
tool to move or deform selected objects and text according to the options
chosen on top.
Inkscape can also manage bitmap images, such as files rendered in pixels.
Go to File, Import... and browse for the image. You can include it within
your document with Embed or add it as a Link to keep your document small
in size.
You can move, scale and edit the image as seen for other elements. In
addition you can go to Path, Trace Bitmap to convert the image into a
group of vectors if necessary.
With Inkscape you can also apply special effects by going to Filters,
Filter Editor... Extend the panel and go to New to define a new filter.
Then select the effect to apply and click on Add Effect: . Make sure to
enable the current filter to check the effect result on the object.
You can also apply several effects in series and drag and move any effect
to change their order.
Each filter is indeed a group of effects applied in series. These are
saved for the whole document and can be applied on any object or group
singularly. You find several filters ready to use within the Filters tab.
Inkscape also includes an XML Editor to check the resulted code of your SVG
document in progress, very useful in case it must be opened by browsers on
the web.
You can also right-click on any object and go to Object Properties... to
check and change their ID selectors associated or add Interactivity
functions to make the object responsive when clicked (onclick), hovered
with your cursor (onmouseover) and so on. These require coding under a
SMIL, CSS3 and JavaScript formats, but we won't see these in this beginner
tutorial.
Please check our video description for additional resources about this.
Now let's see how to save and export your project! Go to File, Save As...
to save the document as an Inkscape or Plain .SVG file that you can open
and edit again with Inkscape or export directly for the web. You can also
choose a low-size .SVGZ file or a .pdf to print your document.
You can also render your document into a bitmap file with File, Export PNG
Image. Choose Page to export the whole document; Drawing to export just
the document area filled with objects and Selection to export just the
selected objects you have. The white document background will be rendered
completely transparent.
Thank you very much for watching this super short tutorial! Visit our
YouTube channel and our official website for more amazing free content!