ui-principles

Community

Polished, precise UI design guidelines.

Authoraussiegingersnap
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Enforce a precise, minimal design system across dashboards and admin interfaces, ensuring consistent typography, spacing, and component quality.

Core Features & Use Cases

  • Design direction: Choose a commit-to-narrative aesthetic (Precision & Density, Warmth & Approachability, Sophistication & Trust, Boldness & Clarity, Utility & Function, Data & Analysis) and apply it across the product.
  • 4px grid and spacing: Apply a strict spacing scale to maintain visual coherence.
  • Typography & surface treatment: Establish hierarchy, font choices, and consistent border radii and shadow usage.
  • Use Case: Ensures enterprise dashboards feel cohesive and trustworthy with a single source of truth for UI rules.

Quick Start

Define your product's design direction and begin applying the 4px grid, typography hierarchy, and consistent surface treatment across components.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 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: ui-principles
Download link: https://github.com/aussiegingersnap/cursor-skills/archive/main.zip#ui-principles

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.