Breakpoint Viewer

Zjistěte, který CSS breakpoint je právě aktivní na libovolném webu. V rohu stránky se zobrazí malý odznak s názvem aktuálního breakpointu, jeho minimální šířkou a skutečnou šířkou vašeho okna prohlížeče v pixelech. Odznak se okamžitě aktualizuje při změně velikosti okna.

Jak to funguje

Nainstalujte rozšíření a otevřete libovolný web. V rohu stránky se zobrazí malý odznak. Při změně velikosti okna se odznak aktualizuje v reálném čase a ukazuje, který breakpoint je právě aktivní. Vyberte si předpřipravený preset pro váš CSS framework nebo si nastavte vlastní breakpointy.

Funkce

• Zobrazuje aktivní CSS breakpoint, jeho minimální šířku a aktuální šířku okna prohlížeče
• Předpřipravené presety pro Tailwind CSS, Bootstrap, Bulma a Foundation
• Vlastní breakpointy s plnou kontrolou nad názvy, šířkami a barvami
• Umístění odznaku v libovolném rohu stránky
• Seznam povolených a blokovaných webů pro správu toho, kde se odznak zobrazuje
• Aktualizace v reálném čase při změně velikosti okna
• Nenáročné na prostředky a nezasahuje do obsahu stránky
• Funguje na libovolném webu

Pro koho je určeno

Pro frontend vývojáře a designéry, kteří tvoří nebo testují responzivní weby. Místo odhadování nebo ručního procházení CSS vám toto rozšíření potřebné informace zobrazí přímo na stránce, vždy na první pohled.

Proč si ho nainstalovat

Malé, rychlé a nijak vás neobtěžuje. Nevyžaduje žádný účet a žádná data neopouštějí váš prohlížeč.