Combining icons and text can be used to identify data and actions in a user interface. Examples include toolbar actions, file and folder displays in a file manager, application listings, and notifications. The layout should be consistent.
- Where icons are shown with text, use the layout guidelines above.
- For 16x16px icons and smaller, the 8px margins may be reduced to 4px.
- If Secondary Text is normally present but is empty in a particular instance, align the Primary Text to the vertical center.
- Where icons are shown without text, always provide tooltip text and alternate text for accessibility.
- To be future-compatible with scalable interface functionality for high dpi displays, use units.smallSpacing in place of the 4px increments defined here.
Content is available under Creative Commons License SA 4.0 unless otherwise noted.