frontend-css

name

Frontend CSS

description

Write maintainable, consistent CSS following established methodologies like Tailwind, BEM, CSS Modules, or utility-first approaches with design tokens and optimized production builds. Use this skill when styling React components, Vue components, Svelte components, or any frontend framework; when applying Tailwind CSS utility classes; when implementing CSS methodologies (BEM, OOCSS, utility-first); when defining design tokens (colors, spacing, typography); when writing custom CSS vs. using framework utilities; when optimizing CSS for production with purging and tree-shaking; when avoiding framework style overrides; when maintaining consistent styling across the application; when working with CSS-in-JS solutions like styled-components or emotion; when creating responsive styles with mobile-first or desktop-first approaches; or when structuring CSS architecture for scalability and maintainability.

Frontend CSS

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.

When to use this skill

• When applying CSS methodologies (Tailwind, BEM, utility classes, CSS modules)
• When styling React, Vue, Svelte, or any frontend framework components
• When defining and maintaining design tokens (colors, spacing, typography)
• When writing custom CSS vs. using framework utilities
• When optimizing CSS for production with purging and tree-shaking
• When avoiding excessive framework style overrides
• When maintaining consistent styling across the application
• When working with CSS-in-JS solutions or component-scoped styles
• When structuring CSS architecture for scalability

Instructions

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