--- url: "/de/emailify/design/dark-mode.md" description: "Dark-Mode-Anpassungen werden nur in Apple Mail unter iOS/MacOS unterstützt (Gmail, Outlook usw. _unterstützen keine_ Dark-Mode-Anpassungen)." --- # Dark-Mode-Anpassungen (nur Apple Mail unter iOS/MacOS) > Dark-Mode-Anpassungen werden nur in Apple Mail unter iOS/MacOS unterstützt (Gmail, Outlook usw. _unterstützen keine_ Dark-Mode-Anpassungen). > **Warning:** Die [Unterstützung für Dark-Mode-Stile](https://www.caniemail.com/features/css-at-media-prefers-color-scheme/) ist bei E-Mail-Clients auf Apple Mail unter iOS/MacOS beschränkt. Dark-Mode-Anpassungen _funktionieren also nicht_ in anderen Clients wie Gmail, Outlook usw. Behalte das im Hinterkopf und gestalte deine E-Mails nach dem Prinzip der [progressiven Verbesserung](https://www.litmus.com/blog/the-ultimate-guide-to-dark-mode-for-email-marketers/). ### Video-Tutorial: Dark-Mode-Stile zu HTML-E-Mail-Designs hinzufügen Dieses Video zeigt, wie du deinen E-Mail-Designs eigene Dark-Mode-Anpassungen hinzufügst, um mit dem Emailify-Plugin produktionsreife, responsive HTML-E-Mails aus Figma zu exportieren. [Embedded media](https://www.youtube-nocookie.com/embed/uAxQ5Psi1m4) ## Wichtige Designaspekte für den Dark Mode {#important-design-considerations-for-dark-mode} ![Unterstützung von Dark-Mode-CSS in E-Mail-Clients](/assets/images/emailify/caniemail-dark-mode.jpg) > **Warning:** Die [Unterstützung für Dark-Mode-Stile](https://www.caniemail.com/features/css-at-media-prefers-color-scheme/) ist bei E-Mail-Clients auf Apple Mail unter iOS/MacOS beschränkt. Dark-Mode-Anpassungen _funktionieren also nicht_ in anderen Clients wie Gmail, Outlook usw. Behalte das im Hinterkopf und gestalte deine E-Mails nach dem Prinzip der [progressiven Verbesserung](https://www.litmus.com/blog/the-ultimate-guide-to-dark-mode-for-email-marketers/). Weil jeder E-Mail-Client den Dark Mode anders umsetzt, ist das Design dafür sehr knifflig. Es lohnt sich aber, _mit_ den (oft fürchterlichen) Änderungen zu arbeiten, die jeder E-Mail-Client im Dark Mode automatisch vornimmt. Als guter Einstieg empfehlen sich Ressourcen wie diese Artikel von [CampaignMonitor](https://www.campaignmonitor.com/blog/email-marketing/designing-an-email-for-dark-mode-dark-and-light-optimization/) und [Litmus](https://www.litmus.com/blog/the-ultimate-guide-to-dark-mode-for-email-marketers/). Sie erklären genau, was die E-Mail-Clients verändern und wie du einige dieser Änderungen im Design abfedern kannst. ## Farbanpassungen für den Dark Mode festlegen {#applying-dark-mode-color-overrides} [Video](/assets/videos/emailify/design/dark-mode-color-override.mp4) Wähle ein Element aus, etwa eine Textebene, ein Bild, einen Button, eine Row, eine Column oder einen Wrapper, und klick dann im Plugin-Header auf den Button **Settings**. Im Bereich **Dark Mode Overrides** unten im Settings-Panel legst du Text- und Hintergrundfarben für den Dark Mode fest. Für Button-, Row-, Column- und Wrapper-Ebenen kannst du außerdem eine Anpassung für **Border Color** festlegen. Damit änderst du die Rahmenfarbe im Dark Mode, ohne die Rahmenstärke oder den Rahmenstil des Light Mode zu verändern. Diese Anpassungen werden in [den E-Mail-Clients, die](https://www.caniemail.com/features/css-at-media-prefers-color-scheme/) diese Funktion unterstützen (Apple Mail unter iOS/MacOS), angezeigt, wenn die E-Mail auf einem Gerät mit aktiviertem Dark Mode geöffnet wird. > **Warning:** Die [Unterstützung für Dark-Mode-Stile](https://www.caniemail.com/features/css-at-media-prefers-color-scheme/) ist bei E-Mail-Clients auf Apple Mail unter iOS/MacOS beschränkt. Dark-Mode-Anpassungen _funktionieren also nicht_ in anderen Clients wie Gmail, Outlook usw. Behalte das im Hinterkopf und gestalte deine E-Mails nach dem Prinzip der [progressiven Verbesserung](https://www.litmus.com/blog/the-ultimate-guide-to-dark-mode-for-email-marketers/). ## Zwischen zwei Bildebenen im Dark und Light Mode wechseln {#swapping-between-two-image-layers-in-dark-and-light-mode} [Video](/assets/videos/emailify/design/swap-dark-mode-content.mp4) Du kannst bestimmte Bildebenen im Dark Mode auch austauschen. Klick dazu auf deine Inhaltsebene in Figma (innerhalb einer Column-Ebene), dann im Plugin-Header auf den Button **Settings**, und aktiviere entweder den Schalter **Only Hide in Dark Mode** oder **Only Show in Dark Mode** – je nachdem, ob die Bildebene in [den E-Mail-Clients, die](https://www.caniemail.com/features/css-at-media-prefers-color-scheme/) diese Funktion unterstützen (Apple Mail unter iOS/MacOS), auf einem Gerät mit aktiviertem Dark Mode angezeigt oder ausgeblendet werden soll. > **Warning:** Die [Unterstützung für Dark-Mode-Stile](https://www.caniemail.com/features/css-at-media-prefers-color-scheme/) ist bei E-Mail-Clients auf Apple Mail unter iOS/MacOS beschränkt. Dark-Mode-Anpassungen _funktionieren also nicht_ in anderen Clients wie Gmail, Outlook usw. Behalte das im Hinterkopf und gestalte deine E-Mails nach dem Prinzip der [progressiven Verbesserung](https://www.litmus.com/blog/the-ultimate-guide-to-dark-mode-for-email-marketers/). ## Den Dark Mode im Plugin in der Vorschau ansehen {#previewing-dark-mode-in-the-plugin} Öffne die Vorschau und aktiviere in der Symbolleiste der HTML-Vorschau den Schalter **Dark Mode**. Mit der Auswahl der Vorschaubreite kannst du dasselbe Dark-Mode-Design weiterhin in Desktop- und Mobilbreite vergleichen. Solange die kombinierte Hybridansicht **Desktop & Mobile** ausgewählt ist, steht Dark Mode nicht zur Verfügung. Die lokale Vorschau nutzt eine allgemeine automatische Dark-Mode-Behandlung und aktiviert die `prefers-color-scheme`-Stile der E-Mail. Ihre Farbanpassungen dienen als grobe Orientierung und bilden keinen bestimmten E-Mail-Client nach. Enthält die E-Mail Dark-Mode-Anpassungen von Emailify, kannst du mit dem benachbarten Schalter **Overrides** deren explizite Stile für Hintergrund, Text, Rahmen und Bildwechsel ein- oder ausblenden. > **Warning:** Der Schalter ist eine Designhilfe, kein Client- oder Geräte-Emulator. Er bildet weder Sanitizer angemeldeter Konten noch native Rendering-Engines und Schriften, App-Oberflächen, die Verarbeitung beim Versand oder alle Unterschiede zwischen Clients und Versionen nach. ## Deine E-Mails im Dark Mode testen {#testing-your-emails-in-dark-mode} ### Video-Tutorial: HTML-E-Mails aus Figma im Dark Mode testen Dieses Video zeigt, wie du aus Figma exportierte HTML-E-Mails mit dem Emailify-Plugin und Litmus.com im Dark Mode testest. [Embedded media](https://www.youtube-nocookie.com/embed/h5Gq9apZrxk) Es lohnt sich immer, deine E-Mails vor dem Versand mit einem Dienst wie [Litmus](https://www.litmus.com/) oder [Email on Acid](https://www.emailonacid.com/) zu testen, damit sie gut aussehen. > **Warning:** Die [Unterstützung für Dark-Mode-Stile](https://www.caniemail.com/features/css-at-media-prefers-color-scheme/) ist bei E-Mail-Clients auf Apple Mail unter iOS/MacOS beschränkt. Dark-Mode-Anpassungen _funktionieren also nicht_ in anderen Clients wie Gmail, Outlook usw. Behalte das im Hinterkopf und gestalte deine E-Mails nach dem Prinzip der [progressiven Verbesserung](https://www.litmus.com/blog/the-ultimate-guide-to-dark-mode-for-email-marketers/). > **Tip:** Du kannst [Einstellungen auf mehrere Ebenen anwenden](/de/emailify/design/settings#apply-settings-in-bulk), indem du **Settings** öffnest und dann in Figma mehrere Emailify-Ebenen desselben Typs auswählst. Jede Einstellung, die du änderst, wird auf alle ausgewählten Ebenen angewendet.