cdockenadnadldjbbgcallicgledbeoc
Open source web design debug tools built with JavaScript: a FireBug for designers. - Point, click, move, resize & tinker - Edit or style any page, in any state, like it's an artboard - Inspect styles, spacing, distance, accessibility and alignment - Nitpick layouts & content, in the real end environment, at any device size - Leverage adobe/sketch skills - Edit text, replace images - Design within the chaos: use production or prototypes and the odd states they produce, as artboards and design opportunities - Design while DevTools simulates latency, i18n, media queries, platform constraints, CPUs, screensize, etc - Make more decisions on the front end of your site/app (a11y, responsive, edge cases, etc) - No waiting for developers to expose their legos, just go direct and edit the end state (regardless of framework) and execute/test an idea Give power to designers & content creators, in a place where they currently feel they have little to none, **by bringing design tool interactions and hotkeys to the browser**
Redux DevTools
Redux DevTools for debugging application's state changes. The extension provides power-ups for your Redux development workflow. Apart from Redux, it can be used with any other architectures which handle the state. This is an open source project. See the official repository for more details: https://github.com/reduxjs/redux-devtools
Viewport Resizer: Ultimate Device Emulator & Website Testing Tool
Emulate devices, resize screens, and perfect your web design effortlessly with this cutting-edge testing and presentation tool. Enhance your web design experience with our dynamic testing and presentation tool, designed to create, test, and showcase your digital experiences on any device, from wearables to very big screens. Customize your workspace fully and use or create your own device mockups, explore various display resolutions, and harness advanced emulation features like touch fingerprint simulation, user-agent emulation, and breakpoint guide, all within a professional-grade environment built for high-quality development and debugging. Push your limits with an intuitive zoomable workspace, precise ruler and grid tools, and a sleek presentation mode called 'Coffee Mode' — think of this tool as a first-level approximation of how your digital experience looks and feels across multiple devices. Limitations: While our tool provides comprehensive device simulations, it does not replace the need for physical device testing.
Designer Tools
A collection of tools to help you design and develop websites with precision. Designer Tools helps web designers and developers achieve pixel-perfect results with ease. It includes features like rulers, guidelines, and multiple ways of measuring elements and spacing. You can customize your setup with grids, move or remove guides, and tweak settings to match your workflow. PLUS subscribers gain access to extra tools and resources to enhance their design process.
File Icons for GitHub and GitLab
A simple browser tool changes file's icon on GitHub, GitLab, gitea and gogs. On GitHub, no matter what kind of file is, their icons are all same. However, in your fancy editor, there are some packages which give every filetype an unique icon. Therefore, I build a simple extension to replace original file icon with filetype-specific icons. This improves visual recognition on GitHub, GitLab, etc. Hope you like it! **This extension is not a project of GitHub or any company**
