Dark mode semantic colours and SF Symbols in status items
Parent: macOS Menu-Bar App Design · Published reference · snapshot 2026-10-02
↓ Facts as markdownall context files
Source-anchored research for Dark mode semantic colours and SF Symbols in status items. Run status: COMPLETED.
These notes link each claim to its source. Some citations identify archived research reports that are no longer hosted on this site. A published reference means the content is available; it does not certify independent review or accuracy.Read the editorial policy and follow the sources before relying on a claim.
Structure and components
- SF Symbols have four rendering modes (monochrome, hierarchical, palette, multicolor); monochrome applies one colour to all layers, which is the mode that suits an adaptive menu bar glyph. (medium confidence) [source]
How it works
- NSImage.SymbolConfiguration(paletteColors:) yields a non-template, permanently coloured glyph. One app used it for a green active dot because vibrancy-disabling did not stop the colour shifting to blue on the dimmed menu bar of a non-key screen. (low confidence) [source]
Facts and statements
- A template NSImage (isTemplate = true) uses only its alpha channel; the system fills it with the correct colour for light/dark menu bar and highlighted state. (medium confidence) [source]
- NSButton only recolours a template image with contentTintColor. Setting isTemplate = false before contentTintColor silently discards the tint: states rendered black (invisible on a dark menu bar) and SF Symbols fell back to default multicolor. (low confidence) [source]
- In SwiftUI MenuBarExtra, Image(systemName:).renderingMode(.original).foregroundStyle(.red) still renders grey in the menu bar. Workaround reported in an Apple forum thread: build an NSImage with NSImage.SymbolConfiguration().applying(.preferringMulticolor()) and wrap it in Image(nsImage:). (low confidence) [source]
- On macOS 26 Tahoe and 27 the menu bar is transparent by default, painted from the wallpaper; system text/icon colour is chosen automatically (white or black) from the brightness behind the bar. Users can enable 'Show menu bar background', Reduce transparency, and the Liquid Glass Clear/Tinted toggle (26.1) or slider (27). Fixed-colour icons therefore need contrast checks on bright and dark wallpapers. (low confidence) (verified as of 2026-10-02) [source]
Children
- No children recorded.