Modern web design trends, principles, and implementation patterns for 2024-2025. Use this skill when designing websites, creating interactive experiences, implementing design systems, ensuring accessibility, or building performance-first interfaces. Triggers on tasks involving modern design trends, micro-interactions, scrollytelling, bold minimalism, cursor UX, glassmorphism, accessibility compliance, performance optimization, or design system architecture. References animation skills (GSAP, Framer Motion, React Spring), 3D skills (Three.js, R3F, Babylon.js), and component libraries for implementation guidance.
Modern web design in 2024-2025 emphasizes performance, accessibility, and meaningful interactions. This skill provides practical guidance on current design trends, implementation patterns, and best practices for creating engaging, accessible, and performant web experiences.
This meta-skill synthesizes knowledge from all animation, interaction, and 3D skills in this repository to provide holistic design guidance.
This SKILL.md is the routing layer. Detailed recipes, examples, integration notes, and troubleshooting guidance live in references/details.md so they are loaded only when the task needs them.
Before producing concrete output, making a design recommendation, or debugging an implementation, load the relevant reference section below. Do not rely on memory for branch-specific APIs, examples, or caveats.
| Task branch | Read first |
|---|---|
| Core Design Principles (2024-2025) | references/details.md#core-design-principles-2024-2025 |
| Common Design Patterns | references/details.md#common-design-patterns |
| Integration with Other Skills | references/details.md#integration-with-other-skills |
| Accessibility Best Practices | references/details.md#accessibility-best-practices |
| Performance Optimization | references/details.md#performance-optimization |
| Common Pitfalls | references/details.md#common-pitfalls |
| Design System Architecture | references/details.md#design-system-architecture |
| Resources | references/details.md#resources |