UTILS.
Privés par défaut
@

Générateur de media queries CSS

Construisez une media query @media responsive avec des préréglages et copiez-la.

Vos fichiers restent sur cet appareil

Les fichiers sont traités dans votre navigateur, jamais envoyés. Le site télécharge le code et les ressources nécessaires aux outils. Sans compte ni traceurs.

Utilisez Télécharger pour enregistrer cet outil dans un fichier HTML utilisable hors ligne.

Confidentialité →

À propos de cet outil

Composez une media query @media responsive en choisissant min-width, max-width ou une plage, plus l'orientation, avec des préréglages d'appareils en un clic, puis copiez le wrapper. Tout s'exécute dans votre navigateur.

Foire aux questions

Quelle est la différence entre min-width et max-width ?
min-width applique les styles à partir de cette largeur et au-dessus (mobile-first), tandis que max-width les applique à cette largeur et en dessous.
Comment fonctionnent les préréglages d'appareils ?
Chaque préréglage remplit des points de rupture typiques — mobile jusqu'à 767px, tablette 768–1023px et ordinateur à partir de 1024px — que vous pouvez ensuite affiner.

Plus d'outils