# Icons

Source: https://developer.apple.com/design/human-interface-guidelines/icons
Skill: hig-foundations
Snapshot: 2025-02-02

---
<!-- hig-doctor:attribution -->
> **Source**: Apple Inc. Canonical content at https://developer.apple.com/design/human-interface-guidelines/icons.
> This file is a structured index of that content, snapshot 2025-02-02.
> Apple HIG text and imagery are © Apple Inc.; this repository provides organization and cross-referencing for AI agent consumption only.

# Icons

## Best practices

**Create a recognizable, highly simplified design.**

**Maintain visual consistency across all interface icons in your app.**

**In general, match the weights of interface icons and adjacent text.**

**If necessary, add padding to a custom interface icon to achieve optical alignment.**

**Provide a selected-state version of an interface icon only if necessary.**

**Use inclusive images.**

**Include text in your design only when it’s essential for conveying meaning.**

**If you create a custom interface icon, use a vector format like PDF or SVG.**

**Provide alternative text labels for custom interface icons.**

**Avoid using replicas of Apple hardware products.**

## Platform considerations

### macOS

#### Document icons

**Design simple images that clearly communicate the document type.**

**Designing a single, expressive image for the background fill can be a great way to help people understand and recognize a document type.**

**Consider reducing complexity in the small versions of your document icon.**

**Avoid placing important content in the top-right corner of your background fill.**

  * 512x512 px @1x, 1024x1024 px @2x

  * 256x256 px @1x, 512x512 px @2x

  * 128x128 px @1x, 256x256 px @2x

  * 32x32 px @1x, 64x64 px @2x

  * 16x16 px @1x, 32x32 px @2x

**If a familiar object can convey a document’s type or its connection with your app, consider creating a center image that depicts it.**

  * 256x256 px @1x, 512x512 px @2x

  * 128x128 px @1x, 256x256 px @2x

  * 32x32 px @1x, 64x64 px @2x

  * 16x16 px @1x, 32x32 px @2x

**Define a margin that measures about 10% of the image canvas and keep most of the image within it.**

**Specify a succinct term if it helps people understand your document type.**

---

<!-- hig-doctor:canonical-footer -->
For the complete guidance, including worked examples and illustrations, see the canonical page: https://developer.apple.com/design/human-interface-guidelines/icons