Breakpoint Viewer

Identifiez le CSS breakpoint actif sur n'importe quel site

Version 1.0.7

Breakpoint Viewer overlay indicating the current responsive breakpoint

Visualisez le point de rupture CSS actif sur n'importe quel site web. Un petit badge apparaît dans un coin de la page et indique le nom du point de rupture actuel, sa largeur minimale ainsi que la largeur réelle de votre fenêtre en pixels. Le badge se met à jour instantanément lorsque vous redimensionnez la fenêtre du navigateur.

Fonctionnement

Installez l'extension et ouvrez n'importe quel site web. Un petit badge apparaît dans un coin de la page. Lorsque vous redimensionnez la fenêtre, le badge se met à jour en temps réel pour indiquer le point de rupture actuellement actif. Choisissez un préréglage correspondant à votre framework CSS ou configurez vos propres points de rupture personnalisés.

Fonctionnalités

  • Affiche le point de rupture CSS actif, sa largeur minimale et la largeur actuelle de la fenêtre
  • Préréglages intégrés pour Tailwind CSS, Bootstrap, Bulma et Foundation
  • Points de rupture personnalisés avec contrôle total sur les noms, les largeurs et les couleurs
  • Positionnement du badge dans n'importe quel coin de la page
  • Liste d'autorisation et liste de blocage pour contrôler l'affichage du badge site par site
  • Mise à jour en temps réel lors du redimensionnement de la fenêtre
  • Léger et sans interférence avec le contenu de la page
  • Fonctionne sur tous les sites web

À qui s'adresse cette extension

Aux développeurs frontend et aux designers qui créent ou testent des sites web adaptatifs. Plutôt que de deviner ou de vérifier manuellement votre CSS, cette extension vous donne l'information en un coup d'œil, directement sur la page.

Pourquoi l'installer

Légère, rapide et discrète. Aucun compte requis et aucune donnée ne quitte votre navigateur.