Skills
.Work. You
Rest

practical-ui

Community

Practical UI guidelines for fast accessible design

Design & Creative#typography#accessibility#layout#design-system#ui-guidelines#practical-ui
Authoryckkkk
Version1.0.0
Installs0

System Documentation

What problem does it solve?

The Practical UI guidelines skill consolidates core UI guidelines into a structured, accessible reference to reduce design drift and speed up decision-making across teams.

Core Features & Use Cases

  • Chapters cover fundamentals, colour, layout & spacing, typography, copywriting, buttons, and forms, organized for quick navigation.
  • Emphasizes WCAG/APCA accessibility principles to improve readability, contrast, and inclusive design.
  • Use cases include onboarding designers, validating UI decisions during reviews, and enforcing consistent UI patterns in code and design systems.
  • Provides a practical workflow that teams can plug into design reviews and component design decisions.

Quick Start

Review the Skill Unit's SKILL.md to understand the mandatory frontmatter contract and begin applying the guidelines to your UI decisions.

Dependency Matrix

Required Modules

None required

Components

scripts

💻 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: practical-ui
Download link: https://github.com/yckkkk/reo/archive/main.zip#practical-ui

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.