Поради щодо темного режиму для таймерів зворотного відліку

Останнє оновлення 30 жовтня 2026 р.

У темному режимі поштові додатки змінюють кольори ваших листів. Деякі майже не змінюють дизайн, інші — затемнюють фон і освітлюють текст, а Gmail, як правило, змінює його найбільше. Ваш таймер — це зображення, тому його кольори ніколи не змінюються. Ці поради допоможуть зберегти його правильний вигляд в обох режимах.

Чому таймер може виглядати неправильно в темному режимі

Фон електронного листа навколо таймера стає темним, але сам таймер зберігає вибрані вами кольори. Таймер на білому тлі у темному електронному листі виглядає як яскраво-білий прямокутник.

Один і той самий електронний лист у світлому та темному режимах. У темному режимі лист стає темно-сірим, але таймер зберігає білий фон і виділяється як біле поле

Ви не можете контролювати, як кожна програма для електронної пошти змінює колір вашого листа, тому спроектуйте таймер так, щоб він виглядав доречно на будь-якому тлі.

1. Надайте таймеру власний фон

Таймер із власним однотонним фоном, наприклад у кольорі вашого бренду, виглядає однаково в обох режимах. Він сприймається як цілеспрямований елемент дизайну, а не як порожнє місце в листі. Додайте трохи Наповнювач (Стандартний та вище) навколо таймера так, щоб він лежав на прозорій картці.

Темно-синій таймер «Ring Progress» з облямівкою, показаний у тому самому електронному листі в світлому та темному режимах; у обох режимах він виглядає однаково

2. Будьте обережні з прозорим фоном

Краї прозорого таймера згладжені вздовж колір фону ви обираєте, навіть з Прозорий . Якщо вибрати білий колір, навколо цифр з’явиться бліде облямівка, коли фон електронного листа стане темним.

Якщо таймер має бути прозорим:

Виберіть середньо-сірий колір фону, наприклад #808080. Після цього облямівка стає набагато менш помітною як на світлому, так і на темному тлі.
Використовуйте цю функцію лише на однотонній ділянці. На фотографії або градієнті краї виглядають нерівно в обох режимах.

Прозорий синій таймер на темному тлі з білим фоном, на якому видно бліду облямівку, а також той самий таймер із середньо-сірим фоном на темному та білому тлі, де облямівка набагато менш помітна. На збільшених вставках видно пікселі по краях

Детальніше про це в Чому мій таймер зворотного відліку на прозорому тлі виглядає розмитим?

3. Обирайте кольори для фону таймера, а не для електронного листа

Яскравий контраст між цифрами та фоном самого таймера забезпечує його читабельність незалежно від оточення. Білі або світлі цифри на темному або кольорі бренду фоні добре видно в обох режимах. Темні цифри на прозорому фоні стають невидимими в темному режимі.

4. Додати контур тексту

Увімкнути контур тексту (Рівень «Power» і вище) додає облямівку навколо цифр і написів. Світлий контур навколо темних цифр або темний контур навколо світлих цифр забезпечує їхню читабельність на будь-якому тлі. Цю функцію можна знайти внизу Текст та написи.

Прозорий таймер із темно-синіми цифрами, які майже зливаються з темним фоном; той самий таймер із білим контуром, який добре видно на темному тлі; та таймер із контуром на білому тлі

5. Розширюйте масштаби

У більших таймерах на кожну цифру припадає більше пікселів, тому краї виглядають плавнішими в обох режимах. Збільште Розмір або Розмір шрифту на етикетці.

Щоб зображення виглядало ще чіткіше на екранах з високою роздільною здатністю, виберіть розмір, який удвічі перевищує необхідний, і додайте width до тегу зображення у вашому коді. Наприклад, таймер розміру X-Large (шириною приблизно 800 пікселів) із width="400" відображається з роздільною здатністю 400 пікселів із подвоєною деталізацією.

6. Спробуйте стиль із вбудованими фігурами

Блоки, кільця та форми у вигляді пігулок надають цифрам власні кольорові контури, завдяки чому вони не залежать від фону електронного листа. Див. параметри налаштування таймера зворотного відліку для всіх стилів.

Що не допомагає

Код темного режиму у вашому шаблоні електронного листа, наприклад: prefers-color-scheme CSS не дозволяє змінити таймер. Його кольори є частиною зображення, а багато поштових програм і так ігнорують цей код.

Перевірте перед відправленням

Надішліть собі тестове повідомлення та відкрийте його в темному режимі в тих додатках, якими ваші підписники користуються найчастіше, наприклад:

Gmail на iPhone та на Android
Gmail у веб-браузері
Apple Mail на iPhone та Mac
Перспективи

Кожен додаток по-своєму підтримує темний режим, тому варто перевірити кілька з них. Якщо після відправлення листа щось виглядає не так, змініть налаштування таймера в Sendtric. Зміни набудуть чинності під час наступного відкриття листа.

Щоб дізнатися більше про таймери зворотного відліку в електронних листах, ознайомтеся з нашою Сторінка «Таймер зворотного відліку електронної пошти».