A Well-designed Online SVG Editor Lets Your Creativity Shine. See how the Most Recent Vecta.io Updates Bring Your Work to Life

August 09, 2022 ·  Sandra · How to Vecta

If you're an SVG enthusiast, you're probably already familiar with Vecta.io, an online SVG editor that includes a built-in SVG optimizer known as Nano. Not only does Vecta.io allows you to create pixel-perfect designs, but also offers extensive collaboration tools for effortless team communication.

Did you know that all icons, illustrations, and artworks on our websites, social media, and other platforms were created exclusively with Vecta.io?

Today, we're excited to share some features that we've recently rolled out and are confident that they will benefit your design process.

SVG image slider plugin

Pure SVG image sliders , including small sizes that scale well on all resolutions, removing the need for coding and Javascript. However, making them is surely not easy, but fret not, we have a plugin for that.

The Export pages as SVG slider plugin can be found under Plugins | Public plugins | Utilities. In the pop-up window, you can set the slider mode, slide speed, and the duration of the auto slider's delay. Alternatively, you can decide whether or not to include buttons for better control of the slider.

Exporting SVG slider

With this plugin, you can easily embed sliders in your website without the need for Javascript and CSS coding. Here’s how it'll look like embedded in your webpage:

Pure SVG image slider (Click to move to next slide)

Learn more about plugins here.

Export SVGs to a zip file plugin

You may need to export multiple pages of SVGs and store them in a single file to access them easily. We wanted to make this process easier for you, as a result, we created a plugin that does just that, saving you the time and effort to do so.

Although the SVGs will be downloaded into a zip file at once, they will be separated into individual files within the zip file to make them convenient to access when needed. This plugin is located in Plugins | Public plugins | Productivity tools.

Exporting multiple pages of SVGs in ZIP file

Learn more about plugins here.

We commonly use PDFs to send information, hence wouldn't you want your PDFs to be able to do more? Perhaps direct readers to your website?

Let us introduce a simple way to demonstrate your diagrams or share information via PDFs. In Vecta, you can export PDFs with hyperlinks to easily navigate viewers to websites or to different pages within the PDF.

How does this work? To link a website to a shape, simply right click on the shape, go to Hyperlink | Insert hyperlink, and choose URL. Then add a website link and description to easily identify the content. You can also determine if the website opens in the current tab or a new tab. See below example to get a clearer picture:

Adding website link to a shape

To link a page to a shape, repeat the steps to open up the Insert hyperlink dialog and choose Page. From the dropdown, choose which page you want to link the shape to, and add a description.

Linking page to a shape

Commenter mode

Introducing a new permission mode: Commenter. With this mode, you may share drawings with key stakeholders without the risk of it being accidentally modified by others.

The commenter’s permissions are as follows:

  • Able to view and export drawings.
  • Able to leave comments on drawings.
  • Able to draw on their own layer which will not make any changes to the actual drawing. The owner of the drawing can choose to show or hide the commenter's layer.

You may invite someone as a commenter to your team, folder or drawings.

Sharing with commenter in Vecta.io
Sharing with commenter in Vecta.io

New connection mode: Connect to connection points only

Connectors in Vecta can be attached between shapes to illustrate the flow of a diagram or a chart. By default, a connector is able to detect shapes when it is dragged over them, thus automatically connecting the shapes.

Aside from the default ‘Connect to shapes’ mode, introducing another connection mode, ‘Connect to connection points only’.

Just as the name suggests, the ‘Connect to connection points only’ mode lets the connectors connect to only the connection points that have been placed on shapes. If there are no connection points present, the connectors simply will not connect to the shape, even if you drag the connector over the shape.

As the GIF below shows, at first, the connector connects to the shapes as their default mode is ‘Connect to shapes’. When their mode is changed to ‘Connect to connection points only’, the connector no longer connects to the shape. Instead, you need to place connection points in order for the connector to attach itself to the shape.

Changing connection mode of shapes

To change the connection mode of a shape, right-click and choose Tools.

Importing Adobe Illustrator(.AI) files

We are aware that .AI is one of the most frequently used file formats in the design industry. We are excited to share that .AI files can be imported into Vecta directly, optimizing your creative experience. Simply drag and drop the Adobe Illustrator file into your Vecta drawing to continue your project.

Importing an .AI file

Recent color in Color Palette

You may easily locate and reuse recent colors from the Color Palette in Shape Properties. To view colors that have been recently used, navigate to Shape, choose Fill, then click on the palette icon. Recent colors can now be picked from the toolbar's color fill and also Shape Properties.

Reusing recent color

New arrow types

As a result of user feedback (we appreciate you lots!), we discovered that our line ends, or arrow types are limited and that there is definitely room for more. As a result, we’ve now included three additional arrow types for users to add to their lines: Square arrow, Sharp arrow, and Reversed sharp arrow.

Make illustrating flow easier in your diagrams and charts with these new arrows. The Sharp arrow and Reversed sharp arrow could also be used to indicate connectors.

To use the new line ends (arrows), click on Line properties on the toolbar.

Line ends(arrows) in Line Properties
Line ends(arrows) in Line Properties

Export DXF pages in one go

Previously, there was only one way to export DXF pages, which was as a single page. If you wanted to export multiple pages, you had to export them one at a time, which was quite troublesome. Now, you have the option to export DXF as a single page or as a ZIP file containing all pages.

Export DXF dialog
Export DXF dialog

Shortcut keys to increase/decrease font size

Looking for the right font size can be a pain when you have to manually change the size multiple times from the dropdown or custom font size dialog.

Save time when you use Vecta’s shortcut keys to easily increase or decrease font sizes. Select any text and press Ctrl/Command + Shift + Dot (.) to increase the font size. To decrease font size, use the shortcut keys of Ctrl/Command + Shift + Comma (,). You can also change the font size of multiple texts at the same time.

Changing font size

More shortcut keys here.

Easy to use online SVG editor

If you're a web designer, illustrator, or simply like to work with SVGs, we believe Vecta.io is the solution for you. Start your artistic journey with Vecta.io now, it’s completely free!

If you are a Vecta.io user, we appreciate your support! Show us your work and tag us on Facebook/Twitter/LinkedIn, or simply use the hashtag #Designwithvecta. Let us know what you want to see next in Vecta by leaving a comment below or sending us an email at hello@vecta.io.

More new features and updates are coming soon.

AUTHOR

Sandra

Keep yourself updated with the latest development on SVG, Web development, CSS and Javascript.

vecta.io Early Access