# Layout Debugger

> Firefox extension for highlighting DOM elements to better debug layout issues

Canonical page: [https://chrome-stats.com/d/layout-debugger](https://chrome-stats.com/d/layout-debugger)

## Overview

- **ID:** `layout-debugger`
- **Platform:** Firefox
- **Type:** Firefox add-on
- **Status:** Available
- **Publisher:** CakhiaTV
- **Category:** web-development,search-tools
- **Daily users:** 2
- **Version:** 1.7
- **Last updated:** 2025-05-07
- **First published:** 2025-05-04
- **Size:** 257 KB
- **Data as of:** 2026-09-07
- **Store listing:** [Firefox Add-ons Store](https://addons.mozilla.org/firefox/addon/layout-debugger/)

## Description

Firefox extension for highlighting DOM elements to better debug layout issues
<ul><li>Identifying too-wide overflowing objects.</li><li>Distinguishing block from inline elements.</li><li>Helping to keep track of element alignment.</li></ul>
Adds a distinct colour outline to each visible DOM element, as well as providing a visual prompt for overflowing divs.

display: block; =&gt; blue;
display: inline; =&gt; purple;
overflowing the viewport =&gt; red!
etc..

## Rankings

- #66,669 — Overall
- #38 — layout
- #83 — debug

## Permissions and access

### Permissions

- `activeTab`

### Content script matches

- `<all_urls>`

## Safety

- **Risk impact:** Moderate risk impact
- **Risk likelihood:** Moderate risk likelihood

### Analysis details

- Allows access to all websites, posing a significant security risk as it can monitor and modify data from any visited site.
- This extension has low user count. Unpopular extensions may not be stable or safe.

> Some risk analysis details are omitted from this free response. [Upgrade to view the full analysis](https://chrome-stats.com/pricing).

## Similar extensions and apps

- [Debug CSS](https://chrome-stats.com/d/pranay-joshi) — 940 users, 4.79 / 5
- [CSS Layout Debugger](https://chrome-stats.com/d/css-layout-debugger) — 166 users, 4.71 / 5
- [CSS Debug Overlay Plus](https://chrome-stats.com/d/css-debug-overlay-plus) — 1 users
- [Devil Debugger](https://chrome-stats.com/d/devil-debugger) — 3 users, 5.00 / 5
- [Accessibility Insights for Web](https://chrome-stats.com/d/accessibility-insights-for-web) — 75 users, 1.00 / 5
- [Css Layout Hack](https://chrome-stats.com/d/css-layout-hack) — 2 users
- [Page Element Highlighter](https://chrome-stats.com/d/pageelementhighlighter)
- [Css Debug with Pesticide CSS](https://chrome-stats.com/d/css-debug-with-pesticide) — 7 users
- [DOM Update Highlighter](https://chrome-stats.com/d/dom-update-highlighter) — 1 users
- [CSS Diagnostics](https://chrome-stats.com/d/css-diagnostics)
- [Display Element Information](https://chrome-stats.com/d/display-element-information)
- [Outline Block Level Elements](https://chrome-stats.com/d/outline-block-level-elements) — 1 users

---

Source: [Chrome-Stats](https://chrome-stats.com/d/layout-debugger)