fix : Unify icons sizes
Some icons show differences regarding the sizing. For example on images below (taken from fluentUI doc icon explorer) if I compare checkmark and presence icons for the same size (here 24px), they differ :
Expected All icons should have same path size
@vnbaaij do you know by chance who to mention in this thread. I raise my problem more than two month ago and still waiting for an answer, besides the actual fix.
You should be able to find the names by looking at the last commits here
Good morning @jasoncuster @spencer-nelson @wood1986. Could someone please look into this.
@jasoncuster @spencer-nelson @wood1986 Can you someone please have a look into this and possibly give it to the correct assignee. Thank would be terrific.
I noticed this too for some icons, uping this topic
@fluentCI @jasoncuster @spencer-nelson @tomi-msft @FluentService thank you guys
which app is this?
@programming-with-ia It's in the icons catalog of Fluent UI. Search for "checkmarkcircle" https://react.fluentui.dev/?path=/docs/icons-catalog--docs
It seems this works as expected / by design ( maybe @spencer-nelson can provide more context I guess ).
For react-icons specifically:
- we use svg provided by design
- then we render the icons in appropriate box based on the size selected
This is source of truth https://github.com/microsoft/fluentui-system-icons/tree/main/assets:
It seems this works as expected / by design ( maybe @spencer-nelson can provide more context I guess ).
For react-icons specifically:
- we use svg provided by design
- then we render the icons in appropriate box based on the size selected
This is source of truth https://github.com/microsoft/fluentui-system-icons/tree/main/assets:
![]()
Yes but here you compared the same icon for different size, issue is for different icons for example presence and checkmark for the same indicated size (20) have different actual path size. If I use both for the same chosen size, visually there is a clear mismatch.
https://www.fluentui-blazor.net/Icon#explorer
Here if you check the path size of the 2 svg you will see one has 20 (good) and the other checkmark circle has 16 (bad)