Back to Details

design-system-generator

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Design System Generator

设计系统生成器

Design system generator that matches natural language descriptions to design trends. Expert in Swiss Modern, Neobrutalism, Glassmorphism, and 20+ other design trends. Includes trend matching scripts and comprehensive design pattern library.
可将自然语言描述匹配到设计趋势的设计系统生成器。精通Swiss Modern、Neobrutalism、Glassmorphism等20余种设计趋势。包含趋势匹配脚本和全面的设计模式库。

When to Use This Skill

何时使用该Skill

Activate on:
  • "design system", "design trends", "trend matcher"
  • "Swiss Modern", "Neobrutalism", "Glassmorphism"
  • "match design style", "design trend recommendation"
  • "component library trends", "modern design patterns"
NOT for:
  • Implementing individual components → 
    design-system-creator
  • Dark mode specifically → 
    dark-mode-design-expert
  • Typography only → 
    typography-expert
  • Accessibility auditing → 
    color-contrast-auditor
触发场景：
  • "design system"、"design trends"、"trend matcher"
  • "Swiss Modern"、"Neobrutalism"、"Glassmorphism"
  • "match design style"、"design trend recommendation"
  • "component library trends"、"modern design patterns"
不适用场景：
  • 实现单个组件 → 
    design-system-creator
  • 专门针对深色模式 → 
    dark-mode-design-expert
  • 仅涉及排版 → 
    typography-expert
  • 可访问性审计 → 
    color-contrast-auditor

Core Capabilities

核心功能

This skill provides a trend matching script that maps natural language descriptions to specific design trends including:
  • Swiss Modern (clean, minimal, professional)
  • Neobrutalism (bold, stark, dramatic)
  • Glassmorphism (transparent, frosted glass)
  • Neumorphism (soft, tactile, raised)
  • Dark Mode (night mode, OLED optimized)
  • Hyperminimalism (essential, calm, zen)
  • Maximalism (vibrant, colorful, rich)
  • Cyberpunk (neon, futuristic, gaming)
  • Retrofuturism (vintage sci-fi, arcade)
  • 3D Immersive (WebGL, AR, interactive)
  • Motion Design (animated, micro-interactions)
  • Bold Typography (oversized, kinetic)
  • Collage (scrapbook, artistic)
  • Sustainable Design (ethical, accessible)
  • Claymorphism (soft, rounded, playful)
  • Terminal Aesthetic (monospace, CLI)
  • Web3/Crypto (gradient, blockchain)
  • Botanical/Organic (natural, earthy)
该Skill提供趋势匹配脚本，可将自然语言描述映射到特定设计趋势，包括：
  • Swiss Modern（简洁、极简、专业）
  • Neobrutalism（大胆、鲜明、富有冲击力）
  • Glassmorphism（透明、毛玻璃效果）
  • Neumorphism（柔和、有触感、凸起效果）
  • Dark Mode（夜间模式、OLED优化）
  • Hyperminimalism（极简核心、平静、禅意）
  • Maximalism（鲜艳、多彩、丰富）
  • Cyberpunk（霓虹、未来感、游戏风）
  • Retrofuturism（复古科幻、街机风）
  • 3D Immersive（WebGL、AR、交互式）
  • Motion Design（动画、微交互）
  • Bold Typography（超大字号、动态感）
  • Collage（剪贴簿、艺术感）
  • Sustainable Design（伦理化、易访问）
  • Claymorphism（柔和、圆润、趣味性）
  • Terminal Aesthetic（等宽字体、CLI风格）
  • Web3/Crypto（渐变、区块链风格）
  • Botanical/Organic（自然、大地色系）

Usage

使用方法

Run the trend matcher script:
bash
npx ts-node scripts/match-trend.ts "description of desired design"
The script will analyze the description and return the best matching design trend with a score and matched keywords.
运行趋势匹配脚本：
bash
npx ts-node scripts/match-trend.ts "description of desired design"
脚本将分析描述内容，返回最匹配的设计趋势，同时提供匹配分数和匹配关键词。