name: Frontend CSS description: Apply consistent CSS styling following project methodology (Tailwind, BEM, CSS Modules, utility classes) with minimal custom CSS, design system tokens, and performance optimization. Use this skill when writing styles in .css, .scss, .module.css files, applying Tailwind classes, maintaining design tokens, or working with any styling approach. Applies when styling components, creating layouts, implementing responsive designs, or ensuring visual consistency through established patterns and avoiding framework overrides.

Frontend CSS

When creating or modifying CSS files like styles.css, App.module.css, components.scss, or tailwind.css
When applying CSS classes in JSX/HTML templates using Tailwind utility classes or BEM methodology
When working in style directories like styles/, css/, scss/, or theme/
When defining design system tokens for colors, spacing, typography, shadows, or other visual properties
When choosing between Tailwind utility classes and custom CSS for component styling
When avoiding excessive framework overrides that fight against library defaults
When implementing responsive designs using CSS media queries or Tailwind responsive modifiers
When optimizing CSS for production through purging/tree-shaking unused styles
When maintaining consistent spacing, colors, and typography across the application
When deciding on CSS methodology (CSS Modules for scoping, BEM for naming, utility-first with Tailwind)
When creating theme configurations or customizing framework defaults in tailwind.config.js or similar
When ensuring CSS performance by minimizing custom styles and leveraging framework utilities

This Skill provides Claude Code with specific guidance on how to adhere to coding standards as they relate to how it should handle frontend CSS.

For details, refer to the information provided in this file: frontend CSS