Which frameworks are compatible with this skill?

It is optimized for modern frontend stacks, specifically React, Tailwind CSS, and CSS-in-JS solutions that support advanced styling and motion libraries.

Does this skill support responsive mobile design?

Yes, it includes universal mobile overrides that ensure complex asymmetrical layouts collapse gracefully into single-column, touch-friendly stacks below 768px.

How does this skill prevent 'generic' AI designs?

It uses an 'Absolute Zero' directive that explicitly bans common defaults like Inter, Roboto, and standard Lucide icons, forcing the AI to use premium alternatives and sophisticated spacing.

What is the 'Double-Bezel' architecture?

It is a design technique that uses nested enclosures with mathematically calculated radii to create a physical, machined look for cards and containers, adding depth to the UI.

Are the animations performance-friendly?

Absolutely. The skill enforces GPU-safe guardrails, strictly limiting animations to transform and opacity properties to avoid layout reflows and frame drops.

High-End Visual Design & UX Architect

Name: High-End Visual Design & UX Architect
Author: cskwork

bycskwork

0•

Design Tools

Transforms AI-generated code into premium, agency-grade digital experiences with obsessive attention to typography, motion, and spatial rhythm.

This skill elevates standard Claude Code output by enforcing elite design standards typically reserved for top-tier digital agencies. It systematically eliminates generic 'AI-style' defaults—such as standard system fonts, harsh shadows, and basic grids—replacing them with sophisticated layout archetypes like the 'Asymmetrical Bento' and 'Z-Axis Cascade.' By implementing a 'Double-Bezel' nested architecture and custom spring physics for motion, it ensures that every generated interface feels expensive, haptic, and performance-optimized for modern web standards.

Key Features

01Agency-tier design language (Apple/Linear aesthetic enforcement)

02Haptic micro-aesthetics and 'Double-Bezel' component architecture

03Anti-pattern blocking (removes generic fonts, icons, and shadows)

040 GitHub stars

05Creative Variance Engine for unique, non-repetitive layout generation

06GPU-safe motion choreography using custom cubic-bezier dynamics

Use Cases

01Building high-conversion SaaS landing pages with ethereal glass textures

02Developing luxury brand portfolios with editorial-style typography

03Creating interactive dashboards with sophisticated, staggered entry animations

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add cskwork/claude-minimal-plugin soft-skill

For use in Claude.ai and ChatGPT

Key Features

01Agency-tier design language (Apple/Linear aesthetic enforcement)

02Haptic micro-aesthetics and 'Double-Bezel' component architecture

03Anti-pattern blocking (removes generic fonts, icons, and shadows)

040 GitHub stars

05Creative Variance Engine for unique, non-repetitive layout generation

06GPU-safe motion choreography using custom cubic-bezier dynamics

Use Cases

01Building high-conversion SaaS landing pages with ethereal glass textures

02Developing luxury brand portfolios with editorial-style typography

03Creating interactive dashboards with sophisticated, staggered entry animations

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add cskwork/claude-minimal-plugin soft-skill

For use in Claude.ai and ChatGPT