skills.rest
kirti
kirtiCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

css-style-fixes

Detect and fix CSS inconsistencies across Tailwind, SCSS, and CSS Modules.

1|Updated Apr 6, 2026
Search Tags:#css#maintainability#code-quality#tailwind#scss#css-modules#stylelint
One-click install
npx skills add https://github.com/kirti/react-ai-skills --skill css-style-fixes
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: css-style-fixes
Source: https://github.com/kirti/react-ai-skills/tree/main/skills/css-style-fixes
Command: npx skills add https://github.com/kirti/react-ai-skills --skill css-style-fixes

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

CSS projects often suffer from inconsistent styling, conflicting rules, duplicated declarations, and non-uniform naming. This Skill detects and fixes these issues, helping teams achieve maintainable and scalable CSS across Tailwind, SCSS, and CSS Modules.

Core Features & Use Cases

  • Detects conflicting styles, duplicate properties, color usage variations, and naming inconsistencies.
  • Recommends CSS variable usage, spacing scales, and consistent naming conventions.
  • Converts inline styles to utility classes and suggests fixes for Tailwind/SCSS/CSS Modules.

Quick Start

Use the CSS style fixes workflow to scan your project and generate actionable recommendations.

Frequently Asked Questions about css-style-fixes

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I find conflicting CSS rules and duplicate declarations in a large frontend codebase?▼

To find conflicting CSS rules and duplicate declarations, scan your project to identify style conflicts, duplicated properties, and color usage variations. This process generates actionable reports and recommends automated fixes for cleaner UI.

What is the best way to enforce consistent naming conventions and spacing scales in SCSS and CSS Modules?▼

Enforcing consistent naming conventions and spacing scales in SCSS and CSS Modules involves analyzing your stylesheets for naming inconsistencies. The analysis recommends standard CSS variable usage and spacing scales to achieve maintainable styling patterns.

Does Stylelint need to be configured to detect Tailwind and CSS Modules inconsistencies?▼

Stylelint-based tooling is required to detect Tailwind and CSS Modules inconsistencies. You need a CSS or SCSS project in your source directory and must run the included analysis scripts to identify conflicting rules and naming inconsistencies.

How do I convert inline styles to Tailwind utility classes automatically?▼

Converting inline styles to Tailwind utility classes involves scanning your frontend codebase to detect inline styling. The process suggests appropriate utility class fixes and promotes maintainable styling patterns across your project.

Why does my CSS codebase have non-uniform color usage, and how can I fix it?▼

Non-uniform color usage in your CSS codebase stems from unmanaged styling variations. Fixing it requires scanning for color usage variations and enforcing standard CSS variable usage to achieve scalable and maintainable styling.

Related Skills

Explore More Software Engineering Skills→
ehtbantonehtbanton

stylelint-config-generator

Generate Stylelint configuration files for CSS/SCSS linting and formatting.

Community
Basic
mvillmowmvillmow
18

create-review-checklist

Generate prioritized review checklists from pull request diffs.

Community
Basic
maxrittermaxritter
1.8k

Frontend CSS Standards

Enforce consistent CSS standards across React, Vue, and Svelte components.

Community
Intermediate
alex5141alex5141

css-standards

Enforce best practices for modular, maintainable, and performant CSS, SCSS, or SASS code.

Community
Intermediate