Fonts Library and Google Fonts

  • Knowledge Base
  • Responsive Website Builder
  • Fonts Library and Google Fonts
  • Duda Support > Responsive Website Builder > Editing a Site

Overview

The responsive website builder features a variety of fonts for your use. Set a global text font or choose to differentiate your text by using multiple different fonts on your website.

Font library

Below is a list of fonts present in the website builder. 

Abril Fatface Contrail One Indie Flower Open Sans Condensed Rokkitt
Alef Cookie Istok Web Open Sans Hebrew Sanchez
Alef Hebrew Courgette Itim Oswald Sans-serif
Alegreya Courier New Josefin Sans Overlock Sansita One
Alfa Slab One Creepster Josefin Slab Oxygen Satisfy
Alike Crete Round Julius Sans One Pacifico Shrikhand
Allura Crimson Text Jura Palanquin Signika
Amaranth Cuprum Karla Palatino Linotype Source Sans Pro
Amatic SC Dancing Script Laila Parisienne Special Elite
Amiko Droid Sans Lato Patua One Spinnaker
Antic Didone Droid Serif Libre Baskerville Paytone One Stalemate
Anton Duru Sans Lobster Permanent Marker Tahoma
Archivo Narrow Dynalight Lobster Two Petit Formal Script Teko
Arial Eater Lora Plaster
Times New Roman
Arial Black EB Garamond Lusitana Play Titan One
Arimo Emblema One Mate SC Playball Titillium Web
Arvo Enriqueta Maven Pro Playfair Display Trebuchet MS
Asap Exo Merienda Poiret One Ubuntu
Bad Script Exo 2 Merriweather Poppins Ubuntu Mono
Belgrano Fjalla One Mogra Prociono
Unifraktur Maguntia
Bitter Flamenco Monoton PT Sans Varela Round
Book Antiqua Fugaz One Montserrat PT Serif Verdana
Bree Serif Garamond Muli Puritan Vollkorn
Butcherman Georgia Museo Slab Quattrocento Work Sans
Cabin Glegoo Nosifer Quattrocento Sans
Yanone Kaffeesatz
Cairo Gloria Hallelujah Noticia Text Quicksand Yesteryear
Cardo Great Vibes Noto Sans
Racing Sans One
 
Catamaran Gudea Noto Serif Raleway  
Caudex Helvetica Nunito Roboto  
Codystar Impact Old Standard TT
Roboto Condensed
 
Comic Sans MS Inconsolata Open Sans Roboto Slab  
 

Adding Google Fonts

Although fonts cannot be added to the font library, you can add new fonts to your site via Google Fonts. Follow the steps below to add more font options to the responsive builder.

Select the Google font you want by adding it using the + icon.

2017-05-04_15-38-35.png

After selecting a font on the Google Fonts site, copy the "@import url" code and the CSS in the "Specify in CSS" area.

2017-05-04_15-49-40.png

Adding a global font using Google Fonts

To add this font to your site's global font in the Duda responsive editor:

  1. Click on the 'Developer Mode' button in the top right corner of your editor.
  2. Navigate to ' Site HTML/CSS', then 'site.css'.
  3. Add the "@import url" code to the top of the page.
  4. Add the following CSS:
1 *#dm div.dmContent *, *#dm div.dmFooter *, *#dm div.dm-title {YOUR_GOOGLE_INTEGRATION_CODE}
addfontsdev1_en-US.png

Replace YOUR_GOOGLE_INTEGRATION_CODE above with the CSS code you copied from Google Fonts. Click Save in Developer Mode. The font is now the global font for the site and has changed all text to this font. You can individually change the fonts in text widgets.

Adding a font to a specific widget

To add this font to an individual text widget in the responsive editor:

  1. Click on the 'Developer Mode' button in the top right corner of your editor.
  2. Navigate to 'Site HTML/CSS', then 'site.css'.
  3. Add the "@import url" code to the top of the page.
  4. Navigate to the text widget and right click, then click the Edit HTML/CSS option.
  5. Add the CSS between the brackets { }.

addfontsdev2_en-US.png

Add the CSS between the brackets { }.

addfontsdev3_en-US.png

Your Google font is now applied to your paragraph. You can use our inline editor to change the colors and edit the text as normal.

×

Please Log in as a Pro

Priority Phone Support is available exclusively to Pros. Log in to your Pro account now to see our international support numbers.

Log In
Not a Pro? Purchase a Pro plan!