Claude MarketplacesSubmit

Premium Frontend Design

kv0906/cc-skills

This is for when you're building interfaces that need to feel expensive and intentional, not just functional. It's framework agnostic and gives you patterns for everything from CSS animations to WebGL shaders, with specific templates for AI tools, crypto dashboards, and SaaS products. The real value is in the design system discipline: strict color architecture, typography rules, and explicit anti-patterns to avoid generic AI aesthetics. It includes accessibility first motion preferences and reduced motion fallbacks, plus a quality checklist for production readiness. Probably overkill for a CRUD admin panel, but if you're shipping something user-facing where first impressions matter, this gives you the guardrails to avoid looking like every other gradient-heavy landing page.

skills.sh installs: 1.4K
GitHub stars: 52
last updated: Aug 21, 2026

Install

$ npx -y skills add kv0906/cc-skills --skill premium-frontend-design --agent claude-code

Installs into .claude/skills of the current project.

Files

Premium Frontend Design Skill

This skill guides creation of production-grade frontend interfaces that feel ALIVE — not generic, not copy-paste, but genuinely crafted experiences that users remember.

"The difference between a good interface and an unforgettable one is intentionality in every pixel."

Dependencies (Flexible — Choose What Fits)

This skill is framework-flexible. Pick packages based on user preference and project needs.

Core 3D (for WebGL templates)

pnpm add three @react-three/fiber @react-three/drei

Animation (choose based on user preference)

Library	Best For	Complexity	Bundle Size
CSS/Tailwind	Simple transitions, micro-interactions	Low	0KB
Framer Motion	React-native feel, layout animations, gestures	Medium	~30KB
GSAP	Complex timelines, scroll-triggered, text effects	High	~60KB
GSAP + Club	SplitText, ScrollTrigger, MorphSVG	High	~80KB

# Framer Motion (simpler, React-idiomatic)
pnpm add framer-motion

SKILL.md on GitHub

Sponsors

Promote your product hereReach 125k+ visitors monthly Promote your product hereReach 125k+ visitors monthly

Agent CaffeineSponsoredClose your lid, come back to finished work

SnugSponsoredThe clipboard manager for the AI era Promote your product hereReach 125k+ visitors monthly

WaxSponsoredBlock anything with supervision, without erasing your iPhone Promote your product hereReach 125k+ visitors monthly

knobsSponsoredSee your site on any phone, any day, in any language

Details

Repository: github.com/kv0906/cc-skills
Categories: Frontend Development, Design & UI/UX

More from kv0906/cc-skills

Svg Art534

Recommended

More Frontend Development

1

vinext-vite-nextjsaradotso/trending-skillsvinext vite nextjs1.3Kskills.sh installs

2

flutter-layoutflutter/skillsflutter layout1.3Kskills.sh installs

3

qt-ui-designtheqtcompanyrnd/agent-skills>-1.2Kskills.sh installs

4

vtex-io-admin-reactvtex/skillsApply when building VTEX IO admin-facing React interfaces under the admin builder. Covers VTEX Styleguide and Shoreline usage, admin page composition, data-heav1.2Kskills.sh installs

5

frontend-designdigitalsamba/claude-code-video-toolkitCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applicat1.1Kskills.sh installs

6

compose-modifier-and-layout-stylechrisbanes/skillsUse when writing or reviewing Jetpack Compose layout APIs, modifier parameters, modifier chain construction, hardcoded root layout decisions, or layout wrappers1Kskills.sh installs