Audits and refactors CSS to ensure strict compliance with BEM methodology and design system tokens.
The CSS BEM Auditor is a specialized skill designed to maintain high standards of CSS architecture by enforcing the Block-Element-Modifier (BEM) methodology. It automatically identifies non-compliant selectors, hardcoded values, and prohibited utility-first patterns (like Tailwind), converting them into structured, scalable, and maintainable styles. By integrating deeply with a project's design system, it ensures all colors, spacing, and typography use authorized CSS custom properties, providing a consistent UI across Astro components, SolidJS islands, and global stylesheets.
Características Principales
01Automated enforcement of BEM naming conventions for blocks, elements, and modifiers.
02Selective refactoring across Astro, SolidJS, and global CSS files.
03Conversion of hardcoded CSS values into semantic design system tokens.
04Audit reports for identifying naming collisions and orphaned selectors.
05Detection and removal of prohibited utility-first and nested CSS patterns.
060 GitHub stars
Casos de Uso
01Standardizing CSS contributions from multiple developers to prevent specificity wars.
02Migrating a legacy codebase from utility-first CSS to a structured BEM system.
03Ensuring design system consistency across a multi-framework project.
