UI Style Lab

Official

Pick a premium UI skin and motion language.

AuthorTimeKast
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill prevents product UIs from feeling generic by helping you choose a coherent visual style family and consistent behavior across surfaces, typography, icons, and motion.

Core Features & Use Cases

  • Skin family recommendations: Select an appropriate style direction (e.g., Midnight Executive, Editorial Premium, Dense Operator) with guidance on where it fits and what to avoid.
  • Surface and layout behavior: Define how depth, layering, and container transitions should work to support hierarchy and readability.
  • Typography, icon, and motion system: Establish a typography posture, an icon treatment policy (including base vs accent roles), and a motion profile for premium interaction feedback.

Quick Start

Use the UI Style Lab to define the product’s visual tone, recommended skin family, surface rules, typography posture, icon strategy, motion profile, and anti-patterns to avoid for your next UI direction review.

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 Style Lab
Download link: https://github.com/TimeKast/AgendaInteligente/archive/main.zip#ui-style-lab

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 471,000+ vetted skills library on demand.