Outliner CSS

A totally awesome structure and layout debugger that inserts CSS outlines to all elements.

Outliner CSS - Chrome Extension for Debugging Layouts

Outliner CSS is a Chrome extension designed to simplify debugging layout and structure issues in website design. It allows developers to insert outlines in multiple colors to all website elements and provides the option to toggle background color opacity, highlighting depth and providing an intuitive sense of the website layout.

Download

Extension stats

By: tarah

Users: 9,000+

-1,000

Rating: 5.00

(11)

Version: 1.0.1 (Last updated: 2017-10-10)

Creation date: 2017-10-10

Risk impact: Very low risk impact

Risk likelihood:

Very low risk likelihood

Manifest version: 2

Permissions:

activeTab
storage

Size: 13.32K

Ranking

# 10,993 ▼ 1,291

Other rankings

#774 in Developer Tools ▲ 3 #64 in layout keyword 55 ▼ 2 #188 in debug keyword 11 ▲ 1

Other platforms

Outliner (v3.6.1)

4.47

(833) 84,985+

Not available on Firefox

Not available on Edge

Want to check extension ranking and stats more quickly for other Chrome extensions? Install Chrome-Stats extension to view Chrome-Stats data as you browse the Chrome Web Store.

Extension summary

Analyze keywords

After years of adding debug styles into projects to help debug structure and layout issues I spent an afternoon making the Outliner CSS chrome extension.

Outliner CSS is added to the current page on all elements with the option to switch between RGB colors and toggle background color opacity to highlight depth.

User reviews

These summaries are automatically generated weekly using AI based on recent user reviews. Chrome Web Store does not verify user reviews, so some user reviews may be inaccurate, spammy, or outdated.

Pros