# Add Custom Google Font in Typography Dropdown in GrapesJS Builder

**URL:** <https://forum.mautic.org/t/add-custom-google-font-in-typography-dropdown-in-grapesjs-builder/25043>\
**Category:** Product Support\
**Created:** [August 13, 2022, 9:25am UTC](https://forum.mautic.org/t/add-custom-google-font-in-typography-dropdown-in-grapesjs-builder/25043 "2022-08-13T09:25:48Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![nitin.vaghela](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.mautic.org/nitin.vaghela/32/8074_2.png) [@nitin.vaghela](https://forum.mautic.org/u/nitin.vaghela)\
**Post date:** [August 13, 2022, 9:25am UTC](https://forum.mautic.org/t/add-custom-google-font-in-typography-dropdown-in-grapesjs-builder/25043/1 "2022-08-13T09:25:48Z")

</div>

I have to add a custom google font in GrapesJs Plugin. for that, I have added the google font URL in the plugin’s assets/library/js/builder.service.js file in initPage() function in the “canvas” section.  
and my custom fonts are visible in the Typography dropdown for the landing page builder. please see screenshots.  
But now I have to make it dynamic by giving users the option to add a custom google font’s URL from the plugin’s setting page. Please see the screenshot.  
so can you please help me with this or recommend any documentation for this?  
Thank you.

 ![Screenshot 2022-08-03 at 4.44.00 PM](https://us1.discourse-cdn.com/flex020/uploads/mautic/original/2X/2/22cee2639ee44d30e0759ecb6b388d9a0d5d1552.png)  
 ![Screenshot 2022-08-03 at 4.45.04 PM](https://us1.discourse-cdn.com/flex020/uploads/mautic/original/2X/d/d7e78ac97190be087da6f1225981794d381dbe4a.png)  
 ![Screenshot 2022-08-03 at 4.45.32 PM](https://us1.discourse-cdn.com/flex020/uploads/mautic/original/2X/c/cccc0a97bd178f55ba5c1f1f6d352348f75ba8c6.png)