Frontend CSS
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 styling UI components or pages with CSS, Tailwind, or other styling approaches
- When applying design system tokens for colors, spacing, typography, or shadows
- When working with CSS files (.css, .scss, .sass, .less, .module.css)
- When writing utility classes or custom CSS styles
- When implementing responsive design rules with media queries or breakpoints
- When working with CSS-in-JS solutions (styled-components, emotion, CSS modules)
- When applying Tailwind utility classes or customizing Tailwind configuration
- When following BEM naming conventions or other CSS methodologies
- When optimizing CSS bundle size with purging or tree-shaking
- When avoiding framework style overrides and working with framework patterns
Instructions
More from coreyja/coreyja.com
frontend components
Design reusable, composable UI components with single responsibility, clear interfaces, and proper state management. Use this skill when creating or refactoring React, Vue, Svelte, or other framework components. When defining component props, interfaces, or APIs. When managing component state or lifting state up to parent components. When building reusable UI elements like buttons, cards, forms, modals, or lists. When implementing component composition patterns. When working with component files (.jsx, .tsx, .vue, .svelte). When documenting component usage or creating component libraries.
9global conventions
Follow established project structure, version control practices, documentation standards, and development workflows to maintain consistency across the team. Use this skill when organizing files and directories in a project. When writing README documentation or contributing guidelines. When creating git commits with clear messages or pull request descriptions. When managing environment configuration or dependencies. When setting up feature flags or maintaining changelogs. When establishing code review processes or testing requirements. This skill applies to all project management and development workflow tasks.
9backend api
Design and implement RESTful API endpoints following REST principles, consistent naming conventions, and proper HTTP methods. Use this skill when creating or modifying API routes, controllers, or handlers in backend code. When implementing endpoint logic that handles HTTP requests (GET, POST, PUT, PATCH, DELETE). When working with API versioning, query parameters, or response formatting. When defining URL structures for resource-based endpoints. When setting up rate limiting or HTTP status code handling. When working with files like route definitions, controller files, API handler modules, or web framework configuration files.
8backend models
Define database models with clear naming, appropriate data types, proper constraints, and relationship definitions. Use this skill when creating or modifying ORM model files, database entity definitions, or data structure schemas. When defining table relationships, foreign keys, and cascade behaviors. When implementing model validation rules, timestamps, or indexes. When working with model files in frameworks like SQLAlchemy, Sequelize, ActiveRecord, SQLx, Prisma, or similar ORMs. When choosing appropriate data types for columns or establishing data integrity constraints (NOT NULL, UNIQUE, foreign keys).
8backend queries
Write secure, performant database queries using parameterized statements, proper indexing, and query optimization techniques. Use this skill when writing SQL queries, ORM query methods, or database access code. When implementing data fetching logic that retrieves or updates database records. When optimizing queries to prevent N+1 problems through eager loading or joins. When using WHERE clauses, JOIN operations, or ORDER BY statements. When implementing transactions for related database operations. When working with query builder methods, raw SQL, or ORM query interfaces. When setting query timeouts or implementing query result caching.
8global validation
Implement secure, comprehensive input validation on both client and server sides using allowlists, type checking, and sanitization to prevent injection attacks. Use this skill when handling user input from forms, API requests, or any external data source. When implementing form validation logic with field-specific error messages. When validating data types, formats, ranges, and required fields. When sanitizing input to prevent SQL injection, XSS, or command injection. When validating business rules like sufficient balance or valid date ranges. When implementing both client-side validation for user experience and mandatory server-side validation for security.
8