Google Font Icons

Questions
1

Hey all,

I was just reading on Twitter and came across a Tweet from Google Fonts about then launching out the materialized icons.

How can we use this on Bubble? Is this something Bubble themselves need to integrate?

1 Like
2

Wow, that would be awesome :slight_smile: :computer:

3

Yeah it would! It was just introduced about 24 hours ago. @allenyang @nick.carroll @josh @emmanuel any thoughts?

4

Hey, @johnny,

I just added <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> in my Script/meta tags in header and add an HTML element with <span class="material-icons md-18">face</span> this for example and it worked perfectly.

But would love to see how can we implement this on the slidable menu, @Bubble

5

Yes, I know thatā€™s possible but I would love it in an element like the ā€œicons.ā€ Maybe Iā€™ll look into making a free plugin for this

1 Like
6

Great idea, @johnny

7

What would be great is a way to use this inline on a text element the same way we can with font awesome icons.

1 Like
8

Yes!!

9

@johnny and @hacker Thanks for the tip. How do adjust the size? I tried using the following. Didnā€™t work.

<span class="material-icons md-30">face</span>
10

Hey, @SumitC,

You need to add

<style>
.material-icons {
  font-size: 24px;
</style>

In the HTML element, and change the font-size to whatever you want.

All the documentation comes here :grinning: :computer:

2 Likes
11

Thank you @hacker. Saw the documentation. Didnā€™t get it. Not HTML literate yet :grinning:

Your answer helped.