draw and create graphics online
Web Application for Creating Vector Graphics in SVG
open janvas...

Panels and Properties of the selection

When a graphic element is selected, the "Transform" panel for geometric information and the panel relative to the type of object selected are shown. For example, if you select an image, the Transform panel and the Image Properties Panel will be shown.

This page shows all the property panels related to the graphic elements.

Transform Panel

The "Transform" panel shows all the geometric properties of a graphic element: position, rotation, size.

Each transformation applied, by changing the values of the properties, starts from  the handle selected in the box (placed at the top center of the panel), which represents a fixed point of the selected element in the page.

Together with the geometric properties, there are also fields that allow moving and scaling the selected elements in a relative way.

The button with the "chain" icon allows you to constrain the height and width ratio.
If you activate the chain button, changing the height value will also change the width proportionally; conversely, by changing the width you will set the height in proportion to the width.

There are also buttons to mirror a graphic element both horizontally and vertically.

Rectangle properties panel

The rectangle graphic element panel shows the properties related to rounding corners. 
The parameters define the curve radius in X and Y.
The button at the bottom of the panel allows you to convert the rectangle into a Path.

Ellipse properties panel

The ellipse graphic element panel shows the properties related to the radius in X and Y.
The button at the bottom of the panel allows you to convert the ellipse into a Path.

Line properties panel

The panel of the "Line" graphic element shows the following properties: length, direction and coordinates of the first and second points.
The button at the bottom of the panel allows you to convert the line into a Path.

Path properties panel

The panel of the graphic element "Path" shows the buttons that allow you to:
- Join 2 selected Paths when the coordinates of their initial or final points coincide.
- Close the path by creating a segment that connects the first point with the last one.
- Combine several selected paths creating a single compound path.
- Separate the paths contained in a compound path.
- Reverse the order of the points that make up a path.

Text properties panel

The panel of the graphic element "Text" shows the global properties of a text box or the properties of a selected portion of text.

The first checkbox at the top right allows you to define whether the text contained in the text box should be plain text or "Rich text", i.e. with the possibility of applying different styles.

The fields allow to set:
- Font name
- Text style
- Font size
- Height of the text line
- Text Decoration
- Letter spacing
- Word Spacing

The buttons with icons allow to:
- Align text to the left
- Center text
- Align text to the right
- Justify text

The labeled buttons allow to:
- Open the Google Fonts library
- Convert text to path trace
- Create text on path

Image properties panel

The properties panel for a selected image shows:

- The URL field
- The actual size of the image

Group properties panel

The panel of the group graphic element consists of 2 buttons.
The first button allows you to separate the group.
The second button allows you to edit the group on an isolated layer.

Symbol properties panel

The properties panel for a selected symbol shows the field relative to its ID.
The buttons allow you to:
- Create a new symbol by duplicating it.
- Edit the symbol on an isolated layer.

Clip path properties panel

The properties panel for a selected element with clipping path shows the buttons that allow you to:
- Remove the clipping path.
- Edit the content and clipping path on an isolated layer.

Mask properties panel

The properties panel for a selected element with clipping mask shows the buttons that allow you to:
- Remove the clipping mask.
- Edit the content and the mask on an isolated layer.

Useful information

Janvas user interface panels can be moved from their initial position to be placed more conveniently for the work at hand.