Till skillnad från webbutveckling finns det ingen standard för mörkt läge i e-post. Varje e-postklient hanterar det på sitt eget sätt. Vissa följer dina stilmallar, andra skriver över dem, och några går helt sin egen väg med automatisk färginvertering. Den här ojämnheten gör att det krävs extra strategi, testning och en god förståelse för hur olika klienter fungerar för att skapa en riktigt bra upplevelse i mörkt läge.

I den här artikeln går vi igenom hur mörkt läge fungerar i e-post, vilka klienter som stöder det, vad du bör se upp med, och hur du bygger mejl som ser bra ut oavsett om mottagaren använder ljust eller mörkt läge.

Vilka e-postklienter har stöd för mörkt läge?

Så fungerar mörkt läge i e-postklienter

Hur mörkt läge beter sig beror på vilken e-postklient som används. Här är en översikt över hur olika klienter hanterar mejl:

Full färginvertering (tvingat mörkt läge)

Vissa e-postklienter tvingar fram mörkt läge, och inverterar färger även om du inte har angett en särskild design för det.

Påverkade klienter: Apple Mail (iOS och macOS), Outlook-appen (iOS och Android)

Hur påverkas det?

• Vita bakgrunder → blir svarta
• Svart text → blir vit
• Vissa bilder kan påverkas, särskilt PNG-filer utan transparent bakgrund

Delvis färgjustering

Vissa e-postklienter justerar färgerna lite grann, istället för att helt invertera dem.

Påverkade klienter: Gmail på iOS och Android

Hur påverkas det: 

• Ljusa bakgrunder → blir något mörkare
• Mörk text → blir ljusare, men inte helt vit

Ingen förändring

Vissa e-postklienter tillämpar inte mörkt läge alls.

Exempel: Gmail i webbläsare, Yahoo Mail, äldre versioner av Outlook för Windows

Vanliga problem med dark mode

Så påverkas dina utskick:

• Bakgrundsfärger kan ändras – vita bakgrunder kan bli svarta eller mörkgrå
• Textfärger kan inverteras – svart text kan bli vit, och vissa färger kan ändras
• Logotyper och bilder kan försvinna – en mörk logotyp på mörk bakgrund blir osynlig
• Knappar kan tappa kontrast – en svart knapp med svart text blir svår att läsa

Exempel på ljust och mörkt läge med färgad bakgrund:

:

Så får du utskick att se bättre ut i mörkt läge

• Använd bilder med transparent bakgrund så att de fungerar i både ljust och mörkt läge
• Lägg till en ljus kant eller ett svagt sken runt mörka logotyper så att de inte försvinner
• Undvik helt svart och vitt – välj mjukare färger som mörkgrå (#222222) och ljusgrå (#F5F5F5) för bättre läsbarhet
• Få knappar att sticka ut genom att välja färger som funkar bra oavsett läge
• Testa ditt mejl i mörkt läge på olika enheter innan du skickar det