question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

mat-icon: How to switch between filled, outlined, rounded and two-toned icons?

See original GitHub issue

Bug, feature request, or proposal:

Help. e.g: there is comment icon <mat-icon>comment</mat-icon> on documentation page https://material.io/tools/icons/?search=comment&icon=comment&style=baseline that icon can be filled, outlined, rounded etc… How to switch in current material implementation?

What is the current behavior?

Currently we include icons by adding following line of code: <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

6.x.x

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:20
  • Comments:12 (1 by maintainers)

github_iconTop GitHub Comments

49reactions
josephperrottcommented, May 31, 2018

Please keep GitHub issues for bug reports / feature requests. Better avenues for troubleshooting / questions are stack overflow, gitter, mailing list, etc.

46reactions
mockuniversecommented, Jun 6, 2018

The bug here is completely inadequate documentation. How do you specify “filled” versus “outlined” in this package? Good luck sorting through the mountain of noise surrounding material in general and material icons specifically for this seemingly simple question (none seem to apply or at least work).

Read more comments on GitHub >

github_iconTop Results From Across the Web

How can I get Angular Material Icon to show the outline in my ...
The general idea is that some of the icons aren't imported by default, and need to be targeted from a different library. Edit:...
Read more >
Using Angular Material Filled, Rounded, Sharp, and Two ...
We want to use outline , filled , rounded , sharp , two-tone variations of the home mat-icon . Approach. Include all the...
Read more >
How to use Material Icon Outlined, Rounded, Two Tone, and ...
Click “Preferences” in the header bar to bring up that dialogue. First, I give it the name of “Material Icons Sharp.” I then...
Read more >
Icon | Angular Material
mat -icon makes it easier to use vector-based icons in your app. ... and allows you to change the color by setting the...
Read more >
Material Symbols and Icons - Google Fonts
Material Symbols are our newest icons consolidating over 2500 glyphs in a ... four adjustable variable font styles (fill, weight, grade, and optical...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found