search

microsoft / fluentui-system-icons

Fluent System Icons are a collection of familiar, friendly and modern icons from Microsoft.
https://aka.ms/fluentui-system-icons
MIT License
5.89k stars 518 forks source link

Design - pixel grid alignment #506

Open UIenhancement opened 1 year ago

UIenhancement commented 1 year ago

pixel grid alignment VS physical center alignment

It seems with the new update the pixel grid alignment is the one to follow :)

Can you add some documentation on how to handle alignment of an icon? Are there any rules on how to shift the graphic and pixel align it? (eg top, left ) proportion: the new plus is slightly bigger (11*11) are there any key lines to take in consideration?

image

jasoncuster commented 1 year ago

Thanks @UIenhancement - This is a great note as we work updates to guidelines. We'll add this to our backlog.

drolevar commented 3 months ago

@jasoncuster Are there any guidelines for designing new icons?

UIenhancement commented 3 months ago

@drolevar

Guidelines are in this Figma file :) https://www.figma.com/community/file/836835755999342788/microsoft-fluent-system-iconography?searchSessionId=lwywyykq-z1ax25jbg0j