Awesome-omni-skill frontend-css

Write and maintain CSS following the project's established methodology (Tailwind, BEM, CSS modules, etc.). Use this skill when adding styles to components, working with CSS utility classes, maintaining design system tokens (colors, spacing, typography), avoiding framework style overrides, or optimizing CSS for production. Applies to files like *.css, *.scss, *.less, Tailwind configurations, and style sections in component files.

install

source · Clone the upstream repo

git clone https://github.com/diegosouzapw/awesome-omni-skill

Claude Code · Install into ~/.claude/skills/

T=$(mktemp -d) && git clone --depth=1 https://github.com/diegosouzapw/awesome-omni-skill "$T" && mkdir -p ~/.claude/skills && cp -r "$T/skills/development/frontend-css-jeremyrdavis" ~/.claude/skills/diegosouzapw-awesome-omni-skill-frontend-css && rm -rf "$T"

manifest: skills/development/frontend-css-jeremyrdavis/SKILL.md

source content

When to use this skill

When adding CSS styles to components or pages
When using Tailwind CSS utility classes
When following BEM or other CSS naming conventions
When working with CSS modules or styled-components
When maintaining design tokens (colors, spacing, typography)
When avoiding unnecessary overrides of framework styles
When minimizing custom CSS in favor of framework utilities
When configuring CSS purging or tree-shaking for production
When editing *.css, *.scss, *.less, or *.module.css files
When adding styles in JSX className or Vue style sections
When working on tailwind.config.js or theme configurations

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