3 个仓库
Awesome GitHub RepositoriesVisual Layout Debugging
Tools for inspecting the visual alignment and layout of page elements using color sampling and rulers.
Distinct from Performance Debugging: Focuses on visual and layout debugging rather than the raw rendering hierarchy or resource-based performance profiling.
Explore 3 awesome GitHub repositories matching development tools & productivity · Visual Layout Debugging. Refine with filters or upvote what's useful.
Awesome Visual Layout Debugging GitHub Repositories
用 AI 发现最棒的仓库。我们将通过 AI 为您搜索最匹配的仓库。
- zxlie/fehelper
zxlie/FeHelper
5,618在 GitHub 上查看FeHelper is a web browser extension toolbox and frontend development toolkit integrated into Chrome, Firefox, and Edge. It serves as a data transformation utility, a web page debugging tool, and an AI-powered coding assistant. The project distinguishes itself by integrating local models and OpenAI-compatible APIs to write, refactor, and repair code directly within the browser. It also provides capabilities for generating TypeScript schemas and Zod definitions from data samples using AI. The toolkit covers a broad range of developer utilities, including network debugging for HTTP and WebSocke
Offers a tool to inspect page performance and capture color samples to resolve visual layout issues.
JavaScriptchatgptchrome-extensioncode-beautify - thoughtbot/neat
thoughtbot/neat
4,368在 GitHub 上查看Neat 是一个 Sass 网格框架和响应式布局系统，用于构建流式、基于列的 Web 架构。它通过中央配置映射以及 Sass Mixin 和函数工具集，提供了一种管理布局属性和全局设计设置的结构化方法。 该系统以处理嵌套网格架构的能力而著称，允许将灵活的网格放置在其他网格容器内，同时保持精确的对齐和间距控制。它还包括用于前端布局调试的开发工具，通过渲染背景引导线来可视化列位置和间距宽度。 该框架涵盖了广泛的布局原语，包括列跨度、偏移和重排序，以及居中的页面容器和清除浮动管理。它通过媒体查询快捷方式实现响应式设计，以适应不同视口宽度下的列跨度和断点配置。 提供了一个命令行界面，用于在项目目录中安装、更新或移除布局框架文件。
Allows for the inspection of visual alignment and gutter widths through rendered guide lines during development.
Rubybourbonbourbon-familycss - oddbird/susy
oddbird/susy
3,831在 GitHub 上查看Susy is a Sass layout framework and grid computation engine designed to automate complex mathematical layout calculations within stylesheets. It functions as a responsive grid generator that calculates column widths, gutters, and spans based on customizable viewport breakpoints to ensure precise element alignment. The system includes a visual layout debugger that generates browser-based grid overlays to verify column alignment and baseline rhythm during development. It also provides utilities for creating repeating background colors and gradients using a template-based syntax. The framework
Ships visual overlays of columns and baselines to verify layout alignment and rhythm directly in the browser.
SCSS
