portfolio-frontend-design

Use this Skill to generate React components with your design system's color palette, typography, and animation patterns already applied. It ensures visual consistency across new components, pages, and sections by enforcing established design tokens like glassmorphism styling, green accents, and Framer Motion animations.

Yes. This Skill generates React components combining Tailwind CSS 3 classes with Framer Motion 12 animation variants. It handles hover effects, gradient text, and animation timing so your portfolio components are both styled and animated consistently.

Use this Skill to generate section components with responsive design, proper animation variants, and accessibility compliance already built in. It applies your dark theme, green/cyan accents, and network-inspired aesthetic automatically, eliminating manual style repetition.

This Skill generates glassmorphism cards and sections with accessibility considerations integrated into the component templates. It ensures your design system components meet accessibility requirements alongside visual consistency and animation patterns.

Yes. This Skill is built for React 19 and Vite 7, generating components that integrate seamlessly with your portfolio's current build setup and framework versions.

This Skill applies to creating new components and modifying existing UI across your portfolio project. Use it to ensure updates maintain the established design language, color palette, animation patterns, and accessibility standards.