data-dense-panels
CommunityBuild dense data panels with accessible UI.
Authorarmanisadeghi
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Building dense admin panels, debug inspectors, and multi-pane UIs often leads to clutter, poor readability, and accessibility gaps. This Skill provides rules and patterns to design compact, high-density interfaces that remain clear and usable across platforms.
Core Features & Use Cases
- Theming and color tokens to ensure consistent light/dark mode and WCAG-compliant contrast.
- Typography and spacing guidelines (4px grid, density management, resizable panels) to maximize information density without sacrificing readability.
- Practical usage examples: inspectors, state views, data browsers, log viewers, and any multi-panel tool UI requiring dense information presentation.
Quick Start
Apply these density and layout patterns when starting a new data-dense panel to achieve high information density with accessible typography and spacing.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: data-dense-panels Download link: https://github.com/armanisadeghi/ai-matrx/archive/main.zip#data-dense-panels Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.