magento-css-specialist

Develops CSS and LESS for Magento 2 with responsive design and performance optimization. Use when styling themes, working with LESS, implementing responsive design, or optimizing CSS performance. Masters modern CSS techniques, LESS preprocessing, and cross-browser compatibility.

Safety Notice

This listing is imported from skills.sh public index metadata. Review upstream SKILL.md and repository scripts before running.

Copy this and send it to your AI assistant to learn

Install skill "magento-css-specialist" with this command: npx skills add maxnorm/magento2-agent-skills/maxnorm-magento2-agent-skills-magento-css-specialist

Magento 2 CSS/LESS Specialist

Expert specialist in creating sophisticated, maintainable stylesheets for Magento 2 applications.

When to Use

  • Styling Magento themes
  • Working with LESS preprocessing
  • Implementing responsive design
  • Optimizing CSS performance
  • Creating component styles

CSS Development

Modern CSS Features

  • CSS Grid & Flexbox: Modern layout techniques
  • Custom Properties: CSS variables for theming
  • Responsive Design: Mobile-first responsive design
  • CSS Architecture: BEM, SMACSS, or ITCSS methodologies
  • Performance Optimization: CSS optimization for fast loading

LESS Preprocessing

  • LESS Mastery: Advanced LESS features, mixins, functions, and variables
  • Variable Systems: Create flexible, themeable variable systems
  • Mixin Libraries: Develop reusable mixin libraries
  • Build Integration: Integrate LESS compilation with build workflows
  • Source Maps: Generate source maps for debugging

Magento Integration

  • Theme Integration: Deep integration with Magento's theming system
  • LESS Framework: Leverage Magento's LESS framework and variables
  • Component Styling: Style Magento UI components
  • Responsive Breakpoints: Implement Magento's responsive breakpoint system
  • Theme Inheritance: Utilize theme inheritance and fallback mechanisms

Best Practices

  • Mobile-First: Implement mobile-first responsive design
  • Performance: Optimize CSS for fast loading
  • Maintainability: Use consistent naming conventions (BEM)
  • Modularity: Create modular, reusable styles
  • Cross-Browser: Ensure cross-browser compatibility

References

Focus on creating maintainable, performant stylesheets that enhance user experience.

Source Transparency

This detail page is rendered from real SKILL.md content. Trust labels are metadata-based hints, not a safety guarantee.

Related Skills

Related by shared tags or category signals.

Coding

magento-module-developer

No summary provided by upstream source.

Repository SourceNeeds Review
Coding

magento-code-reviewer

No summary provided by upstream source.

Repository SourceNeeds Review
Coding

magento-frontend-developer

No summary provided by upstream source.

Repository SourceNeeds Review
Coding

magento-api-developer

No summary provided by upstream source.

Repository SourceNeeds Review
magento-css-specialist | V50.AI