Does it include animations and motion design?

Yes, it prioritizes high-impact motion design, including staggered reveals, scroll-triggered animations, and refined hover states to create a professional feel.

Can I request specific design styles like 'Minimalist' or 'Maximalist'?

Yes, the skill is designed to execute specific tonal directions ranging from brutally minimal to maximalist chaos, ensuring the output matches your specific brand vision.

Which frameworks does the Frontend Design skill support?

It is framework-agnostic and can generate production-grade code for React, Vue, or vanilla HTML/CSS/JS based on your technical constraints.

How does this skill differ from standard AI code generation?

Unlike standard generation, this skill intentionally avoids 'AI aesthetics' like generic fonts and purple gradients, opting instead for bold, intentional design directions and high-quality typography.

Frontend Design Specialist

Name: Frontend Design Specialist
Author: yiyousiow000814

byyiyousiow000814

0•

设计工具

Creates distinctive, production-grade frontend interfaces with high design quality and unique aesthetic directions.

The Frontend Design skill transforms Claude into a sophisticated UI designer and developer, enabling the creation of polished, non-generic web interfaces that avoid the typical 'AI aesthetics.' It guides the generation of production-ready code with a focus on bold typography, intentional spatial composition, and advanced motion design. Whether building a brutalist landing page or a refined luxury dashboard, this skill ensures that every component is visually striking, functional, and meticulously detailed, moving beyond standard templates to deliver memorable user experiences.

主要功能

01Integrates high-impact motion design and micro-interactions using CSS and Framer Motion.

02Utilizes advanced typography pairing and sophisticated CSS styling techniques.

030 GitHub stars

04Implements diverse aesthetic directions including brutalist, retro-futuristic, and editorial styles.

05Supports production-grade implementation across React, Vue, and vanilla HTML/CSS.

06Eliminates 'AI slop' by avoiding generic fonts, layouts, and cliched color schemes.

使用场景

01Prototyping high-end user interfaces that require specific tonal directions like 'playful-toy' or 'industrial-utilitarian'.

02Developing a unique brand landing page that requires an unforgettable, non-standard visual identity.

03Creating complex web components with custom textures, layered transparencies, and grid-breaking layouts.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add yiyousiow000814/xauusd-calendar-agent frontend-design

For use in Claude.ai and ChatGPT

Download Skill