Icon
Icons are visual representations of commands, files, devices, directories, or common actions and are used to provide visual context and enhance usability
Last updated
Was this helpful?
Icons are visual representations of commands, files, devices, directories, or common actions and are used to provide visual context and enhance usability
Last updated
Was this helpful?
Regular icons are designed on a 20px grid and exported on a 24px art board. While preparing the artboard it's important to align elements to the pixel grid to ensure pixel-perfect icons.
Icons sizes followed 4px grid: 16px, 20px, 24px, 32px, 40px, 48px Exceptions to this are object icons which only have two sizes and are custom designed.
Icons should be designed on a 20px grid and exported with padding on a 24px art board.
Build from foundational shapes: square, circle, or rectangles (horizontal or vertical).
Use icon depth to imply multiple or grouped items. Keep 1px space between the butt and other elements.
All square & rectangle shapes should use a 2px border radius depending on the size of the shape and minor radius' are 1px.
All navigation related icons should always be outlined.
When scaling down icons, smaller elements like circles should be solid to help with legibility.
