Attaques CSS sur les webmails : comment des emails piégés peuvent voler vos mots de passe et jetons
Apollinaire Monteclair
Vous utilisez probablement un webmail au quotidien pour votre travail ou vos communications personnelles. Mais saviez-vous que le simple fait d’ouvrir un email peut exposer vos identifiants et vos jetons d’authentification ? Une recherche choc présentée au Black Hat USA 2026 par Gareth Heyes, chercheur chez PortSwigger, révèle que des attaques CSS peuvent permettre au contenu d’un email de s’extraire de sa zone de confiance et d’interagir avec l’interface du webmail lui-même. Selon l’étude, six des plus grands services de messagerie en ligne - Outlook, Gmail, Fastmail, Proton Mail, Yahoo Mail et AOL Mail - sont vulnérables à ces techniques. Les conséquences sont graves : vol de mots de passe, détournement de comptes tiers, fuite de jetons d’authentification et même manipulation d’assistants IA connectés à votre boîte mail. Dans cet article, nous analysons en détail ces attaques, leurs mécanismes et les mesures de protection indispensables.
Des emails qui s’échappent de leur cadre : le principe des attaques CSS
Le principe de base de ces attaques est de franchir la frontière entre le contenu non fiable d’un email et l’interface de confiance du webmail. Les chercheurs ont identifié deux voies principales. La première consiste à abuser des fonctionnalités HTML et CSS que le webmail autorise déjà, comme les éléments <label>, <select> ou les attributs personnalisés. La seconde exploite un écart entre ce que le filtre de sanitization approuve et ce que le navigateur interprète réellement, créant ainsi des éléments DOM porteurs de CSS non autorisés.
Les deux voies d’attaque identifiées :
- Exploitation des fonctionnalités CSS autorisées par le webmail (label, select, custom attributes)
- Création d’une divergence entre le sanitizer et le navigateur (mutation CSS, parsing différent)
Par exemple, dans le cas d’Outlook, les éléments <label> autorisés peuvent déclencher des contrôles en dehors du message, tandis que du JavaScript applicatif transforme des attributs personnalisés sanitizés en nouveaux nœuds DOM échappant à la liste blanche. Une astuce de parsing des media queries a ensuite permis d’obtenir du CSS arbitraire.
« Le contenu d’un email peut s’échapper de son cadre et interagir avec l’interface du webmail », explique Gareth Heyes dans son papier de recherche.
Voici un exemple simplifié de la technique utilisant un label pour détourner un clic :
/* CSS malveillant caché dans un email */
label[for="settings"] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;
cursor: pointer;
opacity: 0;
}
Ce CSS rend un label invisible qui couvre toute la page ; un clic de l’utilisateur déclenche l’élément ciblé par l’attribut for, qui peut être un bouton de modification de paramètres en dehors de l’email. Ce type d’attaque, appelé label-jacking, n’est qu’un exemple des possibilités offertes par l’injection CSS. Les chercheurs ont démontré des chaînes complètes aboutissant à des vols d’informations critiques.
Les chaînes d’attaque concrètes : de la capture de mot de passe à l’exfiltration de jetons
Outlook/Firefox : un faux écran de connexion Microsoft
La chaîne d’attaque la plus spectaculaire cible les utilisateurs d’Outlook sous Firefox. Elle combine plusieurs des techniques décrites précédemment. Tout d’abord, l’attaquant injecte un élément <label> qui cible un bouton de paramètres en dehors de l’email. Le JavaScript d’Outlook, en traitant un attribut personnalisé, crée un nouveau nœud DOM portant du CSS non filtré. Une astuce de parsing des media queries permet ensuite d’obtenir un contrôle total sur les styles.
L’attaquant peut alors masquer un élément <select> derrière un rendu imitant un champ de mot de passe Microsoft. Firefox possède une particularité : le délai d’une seconde avant la sélection d’une option est réinitialisé lorsque l’élément <select> est déplacé hors de l’écran. Ainsi, l’utilisateur croit saisir son mot de passe dans une fenêtre légitime, mais en réalité il sélectionne des options dans un menu déroulant invisible, et chaque sélection est capturée en temps réel par l’attaquant. Cette technique permet de capturer le mot de passe saisi par la victime en temps réel, sans que l’utilisateur ne se doute de rien. Aucun correctif n’avait été déployé pour cette chaîne complète au moment de la publication de la recherche, le 6 août 2026.
Yahoo/AOL : le « paste race » pour dérober des jetons
Une autre chaîne d’attaque exploite le comportement de Firefox lors du collage de contenu HTML dans Yahoo Mail ou AOL Mail. Lorsqu’un utilisateur copie du texte contenant du CSS, le navigateur peut brièvement conserver les styles actifs avant que la sanitization n’intervienne. L’attaquant va initier un flux de connexion à un service tiers, par exemple Medium, puis fournir du CSS à copier. La victime colle ce contenu dans un brouillon Yahoo ou AOL. Les requêtes générées par le CSS actif révèlent des informations sur le jeton de connexion.
Dans le cas de Medium, le jeton est un code de 12 caractères. En analysant les requêtes, l’attaquant peut reconstituer le jeton et se connecter au compte de la victime. Cette technique, appelée paste race, fonctionne car le CSS reste actif pendant un court instant avant d’être nettoyé. Le jeton de connexion Medium, long de 12 caractères, peut être reconstitué à partir des requêtes générées par le collage.
Gmail et l’IA : injection indirecte via Claude Cowork
L’attaque la plus innovante cible les assistants IA qui lisent vos emails. Gmail autorise la propriété CSS image-set() avec une image de secours. Malgré la sanitization, cette image de secours peut déclencher une requête externe. Le chercheur a combiné cette faille avec une injection indirecte de prompt dans un email traité par Claude Cowork d’Anthropic, connecté à Gmail.
Le scénario est le suivant : l’attaquant envoie un email contenant des instructions cachées dans le CSS. Il déclenche également un email de confirmation de jeton Slack. Lorsque la victime demande à Claude Cowork de traiter ses emails, l’assistant lit l’email malveillant et exécute les instructions injectées. Il récupère le jeton Slack et le place dans un brouillon HTML. En visualisant ce brouillon, le jeton est exfiltré via la requête image-set(). Cette démonstration illustre comment les attaques CSS peuvent manipuler des IA génératives, ouvrant la voie à des fuites de données massives.
Fastmail et Proton Mail : autres vecteurs et correctifs
Fastmail a été la cible de plusieurs techniques. La première, appelée CSS hotwiring, permet de rediriger des clics vers des actions non intentionnelles en utilisant des pseudo-éléments et des changements d’opacité. Une autre technique exploite un bug de mutation CSS pour contourner la sanitization. Selon le chercheur, Fastmail a corrigé deux bugs de mutation CSS. Un contournement du proxy d’images de Proton Mail a également été neutralisé, mais une faille exposant l’adresse IP du destinataire a été démontrée. Proton Mail prétend pourtant masquer l’adresse IP et l’heure exacte d’ouverture des emails, comme indiqué dans sa documentation sur la protection des traqueurs. Cette découverte remet en cause ces affirmations.
| Webmail | Technique utilisée | Impact principal | Statut du correctif (août 2026) |
|---|---|---|---|
| Outlook (Firefox) | Label-jacking + media queries + select | Capture du mot de passe en temps réel | Non corrigé (chaîne complète) |
| Yahoo / AOL | Paste race (Firefox) | Vol de jeton d’authentification (Medium) | Non corrigé |
| Gmail | image-set() + prompt injection | Exfiltration de jeton via IA | image-set() non corrigé |
| Fastmail | CSS hotwiring / mutation | Redirection de clics, actions non intentionnelles | Deux bugs corrigés |
| Proton Mail | Bypass proxy | Exposition de l’adresse IP | Bypass corrigé |
Ce tableau montre que, malgré des correctifs partiels, plusieurs vulnérabilités restent ouvertes, exposant les utilisateurs à des risques sérieux.
Les techniques avancées : exfiltration par clic et CSS hotwiring
Au-delà des chaînes d’attaque complètes, les chercheurs ont présenté des techniques génériques qui peuvent être adaptées à différents contextes. L’une d’elles est l’exfiltration par clic, utile lorsque la Content Security Policy (CSP) bloque les requêtes vers des serveurs externes.
Le principe est le suivant : si l’attaquant peut injecter du CSS et qu’un jeton numérique est affiché sous forme de texte dans l’email, il peut utiliser des sélecteurs CSS pour déterminer quels chiffres sont présents et leur fréquence. Il crée ensuite des liens cliquables correspondant à chaque combinaison possible, en masquant ceux qui ne correspondent pas. Lorsque la victime clique sur le lien visible, les données sont envoyées au serveur de l’attaquant.
« Lorsque le CSP bloque les ressources externes, l’exfiltration par clic devient une alternative redoutable », souligne le chercheur.
Une autre technique, le CSS hotwiring démontré sur Fastmail, utilise des pseudo-éléments et des changements d’opacité pour faire apparaître des éléments cliquables à des endroits stratégiques. L’utilisateur croit cliquer sur un bouton inoffensif, mais déclenche en réalité une action sensible, comme la suppression de messages ou l’ajout d’une règle de transfert. Ces techniques montrent la créativité des attaquants et la difficulté de sécuriser complètement le rendu des emails.
Recommandations de défense pour les fournisseurs de webmail
Face à ces menaces, les chercheurs ont formulé des recommandations précises à l’intention des développeurs de webmails. L’objectif est de réduire la surface d’attaque et d’empêcher le contenu des emails d’interagir avec l’interface. L’isolation stricte du contenu HTML est la mesure la plus efficace.
- Isoler le contenu HTML des emails dans des iframes sandboxées avec des restrictions strictes (pas d’accès au DOM parent, pas de scripts, pas de formulaires).
- Restreindre les propriétés CSS autorisées à un ensemble minimal et sûr, en bannissant les propriétés positionnées, les sélecteurs complexes et les fonctions comme
image-set(). - Utiliser une liste blanche de caractères pour la validation des CSS, en éliminant les caractères spéciaux pouvant être utilisés pour des échappements.
- Vérifier la présence de « CSS gadgets » avant d’autoriser des attributs personnalisés, en s’assurant qu’ils ne peuvent pas être transformés en nœuds DOM porteurs de CSS.
- Bloquer les éléments
<select>et les sélecteurs dangereux comme:has(),:is(),:where(), qui peuvent être utilisés pour des attaques de type label-jacking. - Empêcher les requêtes d’images contrôlées par l’attaquant et les domaines autorisés, en utilisant un proxy d’images qui nettoie les URLs.
Ces recommandations s’alignent sur les bonnes pratiques de l’ANSSI en matière de sécurisation des applications web, notamment l’isolation des contenus non fiables. Les utilisateurs finaux peuvent également prendre des mesures, comme utiliser un navigateur à jour, éviter d’ouvrir des emails suspects et désactiver l’affichage HTML lorsque cela est possible.
Conclusion : l’importance d’une isolation stricte face aux attaques CSS
Les attaques CSS sur les webmails représentent une évolution préoccupante de la menace. En exploitant des fonctionnalités légitimes du HTML et du CSS, les chercheurs ont démontré qu’il est possible de voler des mots de passe, des jetons d’authentification et même de manipuler des assistants IA. Six des plus grands webmails mondiaux sont concernés, et certains correctifs tardent à être déployés.
La leçon principale est que l’isolation du contenu des emails est cruciale. Les fournisseurs doivent revoir leurs mécanismes de sanitization et adopter une approche de défense en profondeur. En attendant, nous vous conseillons de rester vigilant : mettez à jour vos logiciels, utilisez l’authentification multi-facteurs et limitez l’utilisation d’assistants IA connectés à votre messagerie tant que ces vulnérabilités ne sont pas corrigées. La sécurité de votre boîte mail en dépend.