Use for product design, UI/UX, branding, high-fidelity web/mobile/desktop interfaces, HTML prototypes, design systems, frontend implementation, and design quality work.
EnglishUse for empty states, no-data UI, AI output streaming, thinking steps, loading states, skeletons, progressive disclosure, and conversational product surfaces.
EnglishUse after design or implementation to package handoff notes, refactor UI code, split god components, document tokens, and prepare maintainable frontend deliverables.
EnglishUse for React Native, Expo SDK 56, NativeWind, iOS/Android UI, mobile UX flows, touch targets, safe areas, and mobile design-system implementation.
EnglishUse for interaction design, animations, progressive blur, animated borders, liquid metal accents, transitions, gesture feedback, and motion quality review.
EnglishUse before major product, UI/UX, branding, or prototype work to clarify goals, audience, constraints, design system, variations, and deliverables.
EnglishUse to review UI/UX quality, identify design inconsistencies, accessibility issues, visual polish defects, implementation debt, and production-readiness gaps.
EnglishUse when researching visual direction from Mobbin, Dribbble, Pinterest, Landing Love, 60fps Design, Godly Website, shadcn/coss/ui, or related UI references.
EnglishUse for production web UI implementation with Next.js 16, TypeScript, Tailwind CSS, shadcn/ui, Radix, TanStack, icons, MUI, or HTML prototypes.
FrenchIncludes Codex Design Core, Empty States and AI Streaming, Handoff and Refactor, and other workflows.
Supported by the Atlas install prompt. Skill-specific requirements vary.
Pack stats
What’s included
Codex Design Core
Use for product design, UI/UX, branding, high-fidelity web/mobile/desktop interfaces, HTML prototypes, design systems, frontend implementation, and design quality work.
Empty States and AI Streaming
Use for empty states, no-data UI, AI output streaming, thinking steps, loading states, skeletons, progressive disclosure, and conversational product surfaces.
Handoff and Refactor
Use after design or implementation to package handoff notes, refactor UI code, split god components, document tokens, and prepare maintainable frontend deliverables.
Mobile App UI Implementation
Use for React Native, Expo SDK 56, NativeWind, iOS/Android UI, mobile UX flows, touch targets, safe areas, and mobile design-system implementation.
Motion and Microinteractions
Use for interaction design, animations, progressive blur, animated borders, liquid metal accents, transitions, gesture feedback, and motion quality review.
Product Design Discovery
Use before major product, UI/UX, branding, or prototype work to clarify goals, audience, constraints, design system, variations, and deliverables.
UI Quality Audit
Use to review UI/UX quality, identify design inconsistencies, accessibility issues, visual polish defects, implementation debt, and production-readiness gaps.
Visual Inspiration Research
Use when researching visual direction from Mobbin, Dribbble, Pinterest, Landing Love, 60fps Design, Godly Website, shadcn/coss/ui, or related UI references.
Web App UI Implementation
Use for production web UI implementation with Next.js 16, TypeScript, Tailwind CSS, shadcn/ui, Radix, TanStack, icons, MUI, or HTML prototypes.
Quick start
- Choose your skills. Select individual skills above, or choose the entire pack.
- Copy the install prompt. Use Copy install prompt above the list.
- Send it to your agent. Paste into your coding agent’s chat. Your agent reviews the source and guides the setup.
Try it with your agent
After installation, start with a request like:
Use the Codex Design Core skill to help with my task.
Ask me for the context you need before getting started.Requirements & license
- A coding agent that can access your project files and install skills.
- Your agent checks each skill’s instructions, dependencies, and permissions during setup.
- Reported license for the skills shown: MIT. The author’s terms apply.