Цвета в Xcode: тёмная тема, высокий контраст и сгенерированные символы

Цвета кажутся самой простой частью приложения — пока не добавишь тёмную тему, вторую платформу и дизайнера, который в третий раз переименовывает «синий». Немного порядка в каталоге ресурсов избавляет от россыпи hex-кодов по всему проекту.

Называйте цвета по роли, а не по значению

Цвет blue500 говорит, как он выглядит; цвет textSecondary или statusSuccess — для чего он нужен. Имена по роли переживают редизайн: когда фирменный синий меняется, вы правите один набор цветов, и за ним следуют все экраны. Начните с небольшого набора — фон, приподнятая поверхность, основной и второстепенный текст, акцент, успех, предупреждение, ошибка — и добавляйте новые, только когда появится реальная потребность.

Один набор цветов — несколько вариантов

Color Set в каталоге ресурсов может хранить разные значения для разных условий:

• ✦варианты Any и Dark, чтобы система сама переключала цвет вместе с тёмной темой;
• ✦варианты High Contrast для тех, кто включает «Увеличение контраста» в настройках универсального доступа;
• ✦цветовое пространство для каждого значения — sRGB для большинства цветов, Display P3, когда нужны более насыщенные оттенки на современных экранах.

Прежде чем заводить свои цвета, посмотрите на системные: label, secondaryLabel, systemBackground и другие уже подстраиваются под тёмную тему и настройки контраста.

Используйте сгенерированные символы

Начиная с Xcode 15, для каждого цвета и изображения в каталоге ресурсов генерируется Swift-символ. Больше никаких строковых имён, которые тихо ломаются после переименования:

// SwiftUI: Xcode генерирует .statusSuccess и .surfaceElevated из каталога ресурсов
Text("Connected")
    .foregroundStyle(Color(.statusSuccess))
    .padding()
    .background(Color(.surfaceElevated))

// UIKit использует те же сгенерированные ресурсы
let tint = UIColor(resource: .brandAccent)

Если цвет переименуют или удалят, сборка упадёт — вместо того чтобы приложение тихо ничего не показало.

Проверяйте контраст цифрами

Читаемому тексту нужен контраст не ниже 4,5:1 относительно фона, а крупному — 3:1 (WCAG AA). На глаз этого не оценить. Работая над собственной консолью, мы выбрали для второстепенного текста на карточке #111111 тёплый серый #6F6B63. На наших экранах он смотрелся отлично, но измеренный контраст оказался всего 3,56:1, и автоматические тесты доступности его отклонили. Замена на #A39F95 подняла контраст примерно до 5,6:1 без изменения характера дизайна.

Единые палитры во всех приложениях

Когда одна студия выпускает много приложений, единообразие становится отдельной задачей: каждый проект начинается с того, что кто-то вручную подбирает цвета. Для этого момента мы и сделали ColorsGen. Он строит гармоничную палитру от выбранного базового цвета — или генерирует её случайно — и готовит для Xcode в пару касаний на iPhone, iPad и Mac. Про иконки и графические ресурсы — наше руководство по размерам иконок в 2026 году.