July 20, 2018 · How To Vecta

You Can Now Use Google Fonts in Vecta

When you’re drawing diagrams or illustrations in Vecta, sometimes you find yourself wanting to use some of your favorite fonts in your drawings. Now you can. Google fonts is now available in Vecta, and you have more than 800 font families to choose in Vecta!

How to use Google Fonts in Vecta?

In addition to default fonts in Vecta, you can now add any Google Fonts into your own fonts selection list! Start by clicking the custom menu in your font selection list, and then inserting the Google Fonts URL into the field. Click OK, and your new font is added into Vecta!

Adding Google fonts in Vecta.io
Adding Google fonts in Vecta.io

An Easier Alternative

Or directly from Symbol Search, you can find all the fonts listed in this drawing:

Most used Google Fonts in 2018
Most used Google Fonts in 2018

Drag and drop them into your drawing, and they will be automatically added into your fonts list.

We’ve made all the popularly used Google Fonts as our symbols to save you more time instead of manually inserting them one by one.

How it looks like after exporting your drawing?

Google fonts used in your drawings will look exactly the same even after exporting it to SVG. Vecta has integrated font embedding feature from Nano, so the custom fonts used in your drawings will be rendered properly and guaranteed to work on any browsers and devices.

Google Fonts after exported to SVG
Google Fonts after exported to SVG

To embed fonts, you’ll need to select Compress SVG when exporting your drawing, and Vecta will do the heavy lifting for you - Compress and Embed fonts at the same time, so your SVG will be well optimized for web usage. Small footprints, save bandwidth and faster loading time! Long gone are the days of downloading and installing font files on your PC just to get nice fonts.

We added Google Fonts in Vecta to help you illustrate your ideas better visually, so please let us know what you think after trying it out!

Like the article? Give the author some claps.

Share it with your friends!
AUTHOR

Yi Qian

CXO at Vecta.io. Solving problems with people for people by connecting dots between brains, over a cup of coffee.

Creating a diagram?

Introducing the world's first SVG editor with javascript based plugins

Learn more...

IF YOU LIKE THIS POST, YOU'LL LIKE THESE TOO

October 25, 2018 · How To Vecta

How to create a customized vector background for your website within 1 minute

Searching high and low to get a vector background for your website? Want to get a vector wallpaper quick but don’t want to be paying for stock vector graphics? You can now create a vector background like below for yourself in less than 1 minu...

August 30, 2018 · How To Vecta

5 Great Reasons you should be using Google Fonts to Design SVG Images

Great typography adds to a great design. But oftentimes, getting a decent custom fonts showing up properly on screens comes at a price, either with extra effort or compromising in quality or even both. We experimented to find out the best ...

August 23, 2018 · How To Vecta

Supercharge Vecta’s functionality with JavaScript based plugins

Vecta is more than just a normal browser-based SVG editor, it's especially powerful when you have all the flexibility you need to make the most out of the platform. Plugins can drastically change the way you work, saves time and enhances producti...

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