Dark Mode

FoundationsFoundations

Source: Apple Inc. Canonical content at https://developer.apple.com/design/human-interface-guidelines/dark-mode. 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.

Dark Mode

Best practices

Avoid offering an app-specific appearance setting.

Ensure that your app looks good in both appearance modes.

Test your content to make sure that it remains comfortably legible in both appearance modes.

In rare cases, consider using only a dark appearance in the interface.

Dark Mode colors

Embrace colors that adapt to the current appearance.

Aim for sufficient color contrast in all appearances.

Soften the color of white backgrounds.

Icons and images

Use SF Symbols wherever possible.

Design separate interface icons for the light and dark appearances if necessary.

Make sure full-color images and icons look good in both appearances.

Text

Use the system-provided label colors for labels.

Use system views to draw text fields and text views.

Platform considerations

iOS, iPadOS

Prefer the system background colors.

macOS

Include some transparency in custom component backgrounds when appropriate.

Resources

Videos

Change log


For the complete guidance, including worked examples and illustrations, see the canonical page: https://developer.apple.com/design/human-interface-guidelines/dark-mode

Get HIG guidance in your AI

Install Apple HIG Skills and get expert design guidance directly in Claude Code.

npx skills add raintree-technology/apple-hig-skills
Email updates aren't configured on this deployment yet. Follow the GitHub repo (opens in new tab) for updates.