designing-ui-system

Community

Craft soulful, non-generic UI design systems.

Author7a336e6e
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill tackles the common issue of generic, uninspired UI design by guiding the creation of a unique and intentional design system that avoids "AI Slop."

Core Features & Use Cases

  • Custom Color Palettes: Develop distinct color tokens that move beyond default blues and grays, incorporating unique hues and tinted neutrals.
  • Expressive Typography: Select and implement fonts that add character, moving away from ubiquitous system fonts.
  • Intentional Spacing & Radius: Define spacing rules and corner radiuses that contribute to the overall aesthetic and user experience.
  • Meaningful Motion: Incorporate custom easing functions for animations that feel premium and responsive.
  • Use Case: When starting a new project or rebranding, use this Skill to define a visual identity that feels handcrafted, premium, and distinct from common templates.

Quick Start

Use the designing-ui-system skill to create a custom color palette and typography scale for a new project.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: designing-ui-system
Download link: https://github.com/7a336e6e/skills/archive/main.zip#designing-ui-system

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.