HTML VISUALIZATION

HTML Visual Validation

HTML Visual Validation gives you information about the html elements, live, on page. It makes easy to inspect the structure of a page with no need to open the browser console. Just select the type of html tag to outline, on page, and to display a label with basic info. - List the most common html tags - Get info about the tittle and description tags - Display tags id and class attributes - extra info: “alt” attribute value - extra info: tells you if it’s an internal or external link, or a javascript call, and if the “target” attribute is set - Mouse over a tag label to bring it to front *** NEW FEATURES *** - Tag selector is now sensitive to tags available on the page - New "DOM Tree" panel, wich can be used with the tag selector - Click on the tag in the DOM Tree to scroll to the element on the page

Css Layout Hack

You can see website layers with different colors easily EN: Css Layout Hack is a powerful Chrome extension tailored for user interface (UI) designers and front-end programmers. With a single purpose in mind, this extension provides a visual representation of website layers by assigning different colors to each layer. By offering a clear and organized view of elements, Css Layout Hack streamlines the design and development process, enhancing efficiency and precision. Layer Identification: Css Layout Hack enables easy identification and differentiation of website layers by assigning distinct colors to each layer. With this feature, you can visually grasp the structure and hierarchy of elements, gaining a deeper understanding of the website's layout. Seamless Integration: This extension seamlessly integrates with your Chrome browser, ensuring quick access whenever you need it. With just a single click, you can activate Css Layout Hack and instantly view the color-coded layers on any website you're working on. Developer-Friendly Tools: Css Layout Hack goes beyond visualizing layers and offers additional tools to aid front-end programmers. It allows you to inspect specific layers, view element dimensions, analyze z-index values, and access relevant CSS properties, empowering you with essential information for efficient coding. By focusing on a single purpose and providing straightforward functionality, Css Layout Hack empowers UI designers and front-end programmers to streamline their workflow and gain deeper insights into website structures. Install Css Layout Hack today and revolutionize your design and development process with its color-coded layers display.

Subeditor: Webpage Text Editor

Edit the text of any webpage on the fly, directly in your browser. Web pages are read-only but did you know that it is possible to edit the content of a web page directly in your browser? Subeditor is a free browser extension that allows you to edit the text of any webpage on the fly. Simply enable Subeditor on the page you’re viewing, click the part of the page you’d like to edit and start typing! Built to be intuitive, easy to use, and lightning fast, Subeditor is a helpful and fun tool for anyone wanting to edit text on the web. Whether you are a content creator trying to craft a message, a designer trying to achieve pixel perfection with text, or someone just looking to have a bit of fun with full “creative direction”, Subeditor is the tool for you. Thanks for trying Subeditor! \(^-^)/ Please do note that web page edits are temporary and the changes are lost when you refresh the page or close the browser. By installing the extension, you agree to Subeditor’s Privacy Policy (https://subeditor.app/privacy)

Outliner CSS

A totally awesome structure and layout debugger that inserts CSS outlines to all elements. Outliner CSS: Your Perfect Debugging Tool Key Features: - Apply outlines to all elements for clear visual structure - Add background depth to enhance element visibility - Save preferences per tab for a seamless, customized experience