Frontend Css Mahmoud9 Dev

---
name: Frontend CSS
description: Write maintainable CSS and styling code using Tailwind CSS, CSS Modules, or other CSS methodologies. Use this skill when styling components, defining design tokens, or working with any CSS-related code. Apply when working on files like *.css, *.scss, *.module.css, tailwind.config.js, components with className props, or any styling code. Essential for following consistent CSS methodologies (Tailwind utilities, BEM, CSS-in-JS), avoiding framework style overrides, maintaining design system tokens (colors, spacing, typography), minimizing custom CSS in favor of framework utilities, and optimizing CSS for production with purging/tree-shaking.
---

## When to use this skill:

- When writing Tailwind CSS utility classes in components
- When editing CSS, SCSS, or CSS Module files
- When configuring tailwind.config.js or design tokens
- When applying consistent spacing, colors, and typography
- When styling React/Vue/Angular components
- When deciding between utility classes vs custom CSS
- When implementing design system patterns
- When optimizing CSS bundle size for production
- When refactoring to reduce CSS overrides and conflicts
- When working with CSS variables and theming
- When ensuring consistent methodology across the codebase

# 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.

## Instructions

For details, refer to the information provided in this file:
[frontend CSS](../../../agent-os/standards/frontend/css.md)