Display the current Tailwind CSS breakpoint and viewport width in a draggable indicator

Latest Version

Version
1.0
Update
January 8, 2025
Size
12.14KiB
Developer
Category
Users
0
Rating
0 ★
Manifest Version
3
Web Store Status
Languages Support
English
See more
Permissions
ActiveTab
Scripting
See more

Tailwind Breakpoint Viewer Extension

**Tailwind Breakpoint Viewer** is the must-have tool for developers using Tailwind CSS. This lightweight and intuitive extension allows you to see the active Tailwind breakpoint in real-time and the exact width of your window.

🎯 **KEY FEATURES**
• Real-time display of the current Tailwind breakpoint (xs, sm, md, lg, xl, 2xl)
• Accurate window width indication in pixels
• Minimalist and elegant interface
• Movable indicator via drag-and-drop
• Instant on/off toggle with a single click

📏 **TAILWIND BREAKPOINTS INCLUDED**
• xs: < 640px
• sm: ≥ 640px
• md: ≥ 768px
• lg: ≥ 1024px
• xl: ≥ 1280px
• 2xl: ≥ 1536px

💡 **SIMPLE TO USE**
1. Click on the extension icon
2. The indicator appears at the bottom right
3. Drag it to wherever you prefer
4. Click the icon again to hide it

🎨 **PERFECT FOR**
• Front-end developers
• Web integrators
• UI/UX designers
• Any Tailwind CSS user

Optimize your responsive development workflow with Tailwind Breakpoint Viewer!
Read more

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "manifest_version": 3, "name": "Tailwind Breakpoint Viewer", "version": "1.0", "description": "Display the current Tailwind CSS breakpoint and viewport width in a draggable indicator", "author": "Hubert Giorgi", "permissions": ["activeTab", "scripting"], "background": { "service_worker": "dist/background.js" }, "action": { "default_icon": { "16": "icons/icon.png", "32": "icons/icon.png", "48": "icons/icon.png", "128": "icons/icon.png" } }, "icons": { "16": "icons/icon.png", "32": "icons/icon.png", "48": "icons/icon.png", "128": "icons/icon.png" }}
Read more

Similar Extensions

icon

GoFullPage - Full Page Screen Capture Extension · Developer Tools 0 77052 ★ 1.81MiB

icon

ColorZilla Extension · Developer Tools 0 3845 ★ 410KiB

icon

JSON Formatter Extension · Developer Tools 0 1859 ★ 19.86KiB

icon

User-Agent Switcher for Chrome Extension · Developer Tools 0 2631 ★ 132KiB

icon

Lighthouse Extension · Developer Tools 0 318 ★ 50.7KiB

icon

Similarweb - Website Traffic & SEO Checker Extension · Developer Tools 0 3255 ★ 1.19MiB

icon

SEOquake Extension · Developer Tools 0 2529 ★ 1.5MiB

icon

Clear Cache Extension · Developer Tools 0 1124 ★ 616KiB

icon

ModHeader - Modify HTTP headers Extension · Developer Tools 0 1061 ★ 676KiB

icon

Postman Interceptor Extension · Developer Tools 0 957 ★ 478KiB

icon

Selenium IDE Extension · Developer Tools 0 286 ★ 3.96MiB

icon

SEO META in 1 CLICK Extension · Developer Tools 0 1108 ★ 462KiB

icon

Stylus Extension · Developer Tools 0 1101 ★ 1.01MiB

icon

CSS Peeper Extension · Developer Tools 0 363 ★ 279KiB

icon

WhatRuns Extension · Developer Tools 0 398 ★ 290KiB

icon

Color Picker for Chrome™ Extension · Developer Tools 0 118 ★ 194KiB

icon

BuiltWith Technology Profiler Extension · Developer Tools 0 407 ★ 54.1KiB

icon

Fake Filler Extension · Developer Tools 0 752 ★ 536KiB

icon

Detailed SEO Extension Extension · Developer Tools 0 193 ★ 266KiB

icon

Responsive Viewer Extension · Developer Tools 0 298 ★ 639KiB

icon

JSON Viewer Pro Extension · Developer Tools 0 137 ★ 349KiB

icon

Requestly - Intercept, Modify & Mock HTTP Requests Extension · Developer Tools 0 1227 ★ 876KiB

icon

Grepper Extension · Developer Tools 0 405 ★ 1.41MiB

icon

Color Tab Extension · Developer Tools 0 1395 ★ 11.21KiB