Claude Code Plugins

Community-maintained marketplace

Feedback

Write and maintain CSS following the project's chosen CSS methodology and design system. Use this skill when adding styles to components using Tailwind, CSS modules, styled-components, or other CSS approaches. Use this skill when working with utility classes, CSS-in-JS, or stylesheet files. Use this skill when implementing design tokens for colors, spacing, and typography. Use this skill when ensuring consistency with the project's CSS framework or methodology. Use this skill when optimizing CSS for production with purging or tree-shaking. Use this skill when avoiding excessive framework style overrides. Use this skill when maintaining a cohesive visual design system across the application.

Install Skill

1Download skill
2Enable skills in Claude

Open claude.ai/settings/capabilities and find the "Skills" section

3Upload to Claude

Click "Upload skill" and select the downloaded ZIP file

Note: Please verify skill by going through its instructions before using it.

SKILL.md

name Frontend CSS
description Write and maintain CSS following the project's chosen CSS methodology and design system. Use this skill when adding styles to components using Tailwind, CSS modules, styled-components, or other CSS approaches. Use this skill when working with utility classes, CSS-in-JS, or stylesheet files. Use this skill when implementing design tokens for colors, spacing, and typography. Use this skill when ensuring consistency with the project's CSS framework or methodology. Use this skill when optimizing CSS for production with purging or tree-shaking. Use this skill when avoiding excessive framework style overrides. Use this skill when maintaining a cohesive visual design system across the application.

Frontend CSS

When to use this skill

  • When writing or modifying CSS, Tailwind classes, or styled-components
  • When implementing styles using the project's CSS methodology (Tailwind, BEM, CSS modules, etc.)
  • When working with design tokens for colors, spacing, typography, or other design values
  • When ensuring visual consistency across components and pages
  • When avoiding unnecessary CSS overrides of framework styles
  • When optimizing CSS output with purging or tree-shaking unused styles
  • When establishing or following naming conventions for CSS classes
  • When working with .css, .scss, .module.css, or CSS-in-JS files
  • When implementing reusable style patterns or utility classes

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