Which frontend frameworks are supported by this skill?

It generates production-grade code for all major environments including standard HTML/CSS, React, Vue, and Tailwind CSS, adapting its implementation to your specific technical stack.

Can I request specific design styles like Brutalism or Minimalism?

Yes, the skill excels at executing specific design directions such as brutalist, maximalist, retro-futuristic, or organic/natural styles with precision and consistency.

How does this skill avoid generic AI-generated aesthetics?

The skill is explicitly instructed to reject overused patterns like Inter typography and purple-on-white gradients, instead prioritizing bold font choices, unexpected layouts, and intentional aesthetic directions.

Does the code include animations and transitions?

Absolutely. It prioritizes motion design to create delight, using CSS-only solutions for light implementations or libraries like Framer Motion for complex React interactions.

Frontend Design Expert

Name: Frontend Design Expert
Author: ivannxbt

byivannxbt

•

デザインツール

Generates high-fidelity, production-grade frontend interfaces that break away from generic AI design patterns.

This skill empowers Claude to act as a world-class UI/UX designer and frontend engineer, moving beyond standard templates to create distinctive, aesthetically-driven web components and applications. It focuses on bold typography, intentional color palettes, and sophisticated motion design to deliver interfaces with high-impact visual character, suitable for everything from minimalist landing pages to maximalist dashboards. By prioritizing intentionality over generic aesthetics, it ensures every UI is memorable, functional, and tailored to its specific brand context.

主な機能

01Non-standard spatial layouts and grid-breaking compositions

02Anti-generic 'AI Slop' design philosophy for unique visual identities

03Atmospheric UI details including gradient meshes and noise textures

04Sophisticated typography pairing and characterful font selection

051 GitHub stars

06High-impact motion design using CSS and React animation libraries

ユースケース

01Creating interactive React components with complex micro-interactions

02Developing bespoke dashboards for creative, luxury, or technical brands

03Building high-conversion landing pages with unique visual identities

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add ivannxbt/config frontend-design

For use in Claude.ai and ChatGPT

Download Skill