Skills
.Work. You
Rest

friendly

Community

Create approachable UI guidance with Friendly

Design & Creative#accessibility#design system#qa checklist#ui guidelines#typography scale#component states#token palette
AuthorPiercingXX
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Friendly turns your design intentions into consistent, implementation-ready guidance so teams can build approachable interfaces without guesswork or accessibility regressions.

Core Features & Use Cases

  • Design foundations you can implement: Defines Friendly’s typography scale, spacing rhythm, and pastel token palette for consistent UI.
  • Component-level rules with states: Produces actionable guidance covering anatomy, variants, and interaction states such as default, hover, focus-visible, active, disabled, loading, and error.
  • Practical accessibility and QA gates: Embeds WCAG 2.2 AA expectations and a code-review QA checklist to keep quality measurable.

Quick Start

Ask the AI to generate Friendly design-system guidance for your next button and form components using the Friendly tokens, accessibility requirements, and a code-review QA checklist.

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: friendly
Download link: https://github.com/PiercingXX/xx-stack/archive/main.zip#friendly

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.