design-preset-system
Design Preset System
Overview
Modular design preset system enabling seamless style switching while maintaining consistency and quality across any React Native or Next.js application.
When to Use
- Starting new project and choosing design direction
- Switching design style for existing project
- Applying consistent aesthetic across components
- Exploring different design approaches
- Presenting design options to stakeholders
When NOT to Use
- Creating custom design system from scratch (use
design-system-foundationinstead) - Just refactoring code (use
ui-refactoring-workflowinstead) - Need documentation only (use
design-documentation-generatorinstead)
Available Presets
More from apexscaleai/claude-ui-design-system
design-system-foundation
Use when starting a new React Native or Next.js project to establish design system foundation - creates design tokens, folder structure, component architecture, and documentation scaffolding for consistent UI development
11ui-refactoring-workflow
Use when refactoring existing React Native, Next.js, or TypeScript UI code to apply modern design principles and aesthetic excellence - analyzes current implementation, applies design presets, maintains functionality while elevating visual quality
11aesthetic-excellence
Use when improving visual quality of existing UI - applies 2025 design principles for hierarchy, spacing systems, color theory, and typography excellence to elevate aesthetic appeal and user experience
9