Write, review, or refactor CSS using custom properties and logical properties.
npx skills add https://github.com/schalkneethling/webdev-agent-skills --skill css-coder
Please help me install this Agent Skill. Skill: css-coder Source: https://github.com/schalkneethling/webdev-agent-skills/tree/main/css-coder Command: npx skills add https://github.com/schalkneethling/webdev-agent-skills --skill css-coder
This Skill helps developers write CSS that adheres to web standards, improves accessibility, and optimizes performance by providing patterns, snippets, and conventions.
Use the css-coder skill to audit a CSS file and refactor it according to references/patterns.md, focusing on custom properties, logical properties, and accessible color contrast.
High-intent search queries and answers about installing and using this skill.
Refactoring CSS for accessibility and maintainability involves replacing static values with custom properties for theming, adopting logical properties for internationalization, and applying low specificity selectors to ensure styles remain manageable and screen-reader friendly.
CSS logical properties are flow-relative styling attributes that adapt to text direction, and you need them when building responsive layouts or internationalized web projects to ensure visual spacing and structure adapt automatically across different writing modes.
Use CSS custom properties for theming by defining global design tokens such as colors and spacing, which allows you to dynamically update visual styles without increasing specificity, leading to better performance tuning and easier maintainability across web projects.
CSS refactoring for web standards works with modern color syntax and reduced motion considerations by applying accessibility-first patterns that enforce high contrast, clear focus styles, and disable non-essential animations for users who prefer reduced motion.
The best conventions for writing low specificity CSS selectors include using class-based patterns, leveraging custom properties for cascading values, and adopting shared-first workflows to ensure component styles remain modular, performant, and easy to override.
CSS component styling often breaks when switching to a shared-first workflow if the existing styles rely on high specificity overrides instead of custom properties and logical properties, making it difficult to adapt layouts dynamically across varying contexts.
vidzzaGuide CSS authoring with web standards, accessibility, and performance.
nazlicancaglarTranslate brand visual identity into tokenized CSS custom properties and design tokens.
ivanrvpereiraTranslate UI intent into production-ready HTML/CSS/JS or framework components.
xobotyiEnforce modern CSS conventions with low specificity and explicit cascade control.
